npm 包 gcp-api-backoff 使用教程

简介

在前后端分离的架构中，前端需要向后端请求数据进行页面渲染。而在这个过程中，由于各种原因，可能会遇到后端 API 返回错误的情况，此时前端需要进行重试，直到请求成功为止。gcp-api-backoff 正是一个用于实现自动重试的 npm 包。

安装

npm install gcp-api-backoff --save

使用方法

1. 导入 gcp-api-backoff

import backoff from 'gcp-api-backoff'

1. 在请求函数中使用 backoff

例如我们有一个请求函数 getData，使用 axios 发送请求。

import axios from 'axios'

function getData() {
  return axios.get('/api/data')
}

使用 backoff 时，只需将 getData 函数传入 backoff，并设定重试的最大次数和重试间隔时间。

function getDataWithBackoff() {
  return backoff(getData, {
    maxRetries: 5,
    retryDelay: 1000
  })
}

当 getDataWithBackoff 被调用时，如果 getData 返回 Promise 失败，则会自动进行最大 maxRetries 次重试，每次重试间隔 retryDelay 毫秒。

1. 错误处理

在没有使用 backoff 的情况下，请求失败时我们可以在 catch 中进行错误提示。

function getData() {
  return axios.get('/api/data')
    .catch(error => {
      alert('请求失败，请重试')
    })
}

而使用 backoff 后，由于进行了自动重试，我们需要在最终全部重试失败时进行错误提示。

-- -------------------- ---- -------
-------- -------------------- -
  ------ ---------------- -
    ----------- --
    ----------- ----
  --
    ------------ -- -
      -----------------
    --
-

示例代码

最终的代码如下：

-- -------------------- ---- -------
------ ------- ---- -----------------
------ ----- ---- -------

-------- --------- -
  ------ ----------------------
    -------------- -- -
      ------ -------------
    --
-

-------- -------------------- -
  ------ ---------------- -
    ----------- --
    ----------- ----
  --
    ------------ -- -
      -----------------
    --
-

以上的示例代码中，我们使用 axios 进行了请求，返回数据在 then 中进行处理。使用 backoff 进行请求时，只需要将 getData 函数传入 backoff 即可，并设定重试的最大次数和重试间隔时间。若全部重试失败，则会在 catch 中提示错误信息。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cf581e8991b448e6b56