fetch retry request (on failure)

by

From the fetch docs :

fetch("https://stackoverflow.com/users")
    .then(checkStatus)
    .then(parseJSON)
    .then(function(data) {
          console.log('succeeded', data)
    }).catch(function(error) {
          console.log('request failed', error)
    })

See that catch? Will trigger when fetch fails, you can fetch again there.
Have a look at the Promise API.

Implementation example:

function wait(delay){
    return new Promise((resolve) => setTimeout(resolve, delay));
}

function fetchRetry(url, delay, tries, fetchOptions = {}) {
    function onError(err){
        triesLeft = tries - 1;
        if(!triesLeft){
            throw err;
        }
        return wait(delay).then(() => fetchRetry(url, delay, triesLeft, fetchOptions));
    }
    return fetch(url,fetchOptions).catch(onError);
}

Edit 1: as suggested by golopot, p-retry is a nice option.

Edit 2: simplified example code.

More Related Contents:

  1. Trying to use fetch and pass in mode: no-cors
  2. Why does .json() return a promise?
  3. 5xx or 4xx error with “No ‘Access-Control-Allow-Origin’ header is present”
  4. Error when accessing API with fetch while setting mode to ‘no-cors’ [duplicate]
  5. Fetch request to local file not working
  6. How do I POST a x-www-form-urlencoded request using Fetch?
  7. Setting query string using Fetch GET request
  8. How do I POST with multipart form data using fetch?
  9. Upload progress indicators for fetch?
  10. fetch: Reject promise with JSON error object
  11. Getting “TypeError: Failed to fetch” when the request hasn’t actually failed
  12. Using an authorization header with Fetch in React Native
  13. Returning HTML With fetch()
  14. using a fetch inside another fetch in javascript
  15. fetch – Missing boundary in multipart/form-data POST
  16. Fetch API vs XMLHttpRequest
  17. Retrieve data from a ReadableStream object?
  18. What causes a Failed to execute ‘fetch’ on ‘ServiceWorkerGlobalScope’: ‘only-if-cached’ can be set only with ‘same-origin’ mode error?
  19. Why is the response object from JavaScript fetch API a promise?
  20. Intercept fetch() API requests and responses in JavaScript
  21. Using JavaScript Axios/Fetch. Can you disable browser cache?
  22. How to fetch XML with fetch api
  23. Unable to fetch POST without no-cors in header
  24. Javascript: Fetch DELETE and PUT requests
  25. UseEffect being called multiple times
  26. How to get the filename from a file downloaded using Javascript Fetch API?
  27. The best placeholder polyfil script for ie7, ie8 and ie9 [closed]
  28. How to post image with fetch?
  29. FastAPI returns “Error 422: Unprocessable entity” when I send multipart form data with JavaScript Fetch API
  30. Cannot Upload File to FastAPI backend using JavaScript Fetch API in the frontend

Leave a Comment