5

I have a fetch request in React js which calls an API (Node js Backend Server). For any request made through Google Chrome which took more than 2 minutes, the fetch request throws me error:

"Failed to Fetch".

If I pass fewer parameters (i.e. request for which server took less than 2 minutes), it works fine.

Below is my code.

 fetch(url , requestOptions)
          .then(response => response.blob())
          .then(blob => {
            const newBlob = new Blob( [blob], {type: 'application/zip'});
            const downloadUrl = URL.createObjectURL(newBlob)
                    let a = document.createElement("a"); 
                    a.href = downloadUrl;
                    a.download = "reports";
                    document.body.appendChild(a);
                    a.click();
                    alert(this.state.selectedReport + "Reports Downloaded Successfully")
      
          })
          .catch((error) => {
            alert("Error in downloading report " + error)
        })

Through browsing over internet, I found that there is no timeout parameter in fetch request.

I tried using await and async but it didn't work out and also answers from the below link.

Removing Fetch API default timeout

I want to fetch the data for which backend server take more than 2 minutes. Can anyone help me on this?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
user2641452
  • 105
  • 2
  • 10

1 Answers1

1
  1. try replicating the request using curl.
  2. if you were able to request a report that takes more than two minutes, then it's a server timeout and we need to increase the timeout on the server side.
  3. if you were able to download through curl, then you can follow this article https://dmitripavlutin.com/timeout-fetch-request/
Abdalrahman Valabji
  • 140
  • 6