web-dev-qa-db-ja.com

フェッチ再試行要求（失敗時）

ネットワークリクエストにブラウザのネイティブ fetch API を使用しています。また、サポートされていないブラウザで whatwg-fetch polyfillを使用しています。

ただし、リクエストが失敗した場合に備えて、再試行する必要があります。今、このnpmパッケージがあります whatwg-fetch-retry 見つかりましたが、ドキュメントでの使用方法は説明されていません。誰かがこれで私を助けたり、私に代替案を提案したりできますか？

javascriptfetch-apipolyfills
10
dsaket

公式のフェッチドキュメントから：

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

そのキャッチを参照してください？フェッチが失敗したときにトリガーされます。たとえば、そこで再度フェッチできます。

Promiseをご覧ください https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

編集：結果を返すはずの実際の例を追加します。 Chrome（v.60.0）を試してみて、ポリフィルも、言及したパッケージも使用していません（ドキュメントを注意深く読んだ後、それはフェッチポリファイルからの単なるフォークのようです）。

function fetchRetry(url, delay, limit, fetchOptions = {}) {
    return new Promise((resolve,reject) => {
        function success(response) {
            resolve(response);
        }
        function failure(error){
            limit--;
            if(limit){
                setTimeout(fetchUrl,delay)
            }
            else {
                // this time it failed for real
                reject(error);
            }
        }
        function finalHandler(finalError){
            throw finalError;
        }
        function fetchUrl() {
            return fetch(url,fetchOptions)
                .then(success)
                .catch(failure)
                .catch(finalHandler);
        }
        fetchUrl();
    });
}

fetchRetry('https://www.google.es',1000,4)  
   .then(function(response){
       if(!response.ok){
           throw new Error('failed!');
       }
       return response;
   })
   .then(function(response){
       console.log(response);
   })
   .catch(function(error){
       console.log(error);
    });

再試行で応答が返されるかどうかはテストしていませんが、そうだと思います。

編集：このパッケージを見つけましたが、フェッチAPIを置き換えますので、それについてはよくわかりません https://www.npmjs.com/package/fetch-retry （次のような2つのパッケージがあります）これはfetch-retryの最初のGoogle結果ページにあります...）

5
Isidro Torregrosa

p-retry のように、約束の再試行にはいくつかのライブラリを使用することをお勧めします。

例：

const pRetry = require('p-retry')
const fetch = require('node-fetch')

async function fetchPage () {
  const response = await fetch('https://stackoverflow.com')

  // Abort retrying if the resource doesn't exist
  if (response.status === 404) {
    throw new pRetry.AbortError(response.statusText)
  }

  return response.blob()
}

;(async () => {
  console.log(await pRetry(fetchPage, {retries: 5}))
})()
1
golopot