2

所以我的场景是这样的：

  1. 我有两种类型的请求：不需要授权信息的“公共”请求和需要授权信息的“授权”请求。
  2. 对于授权请求，在实际发送每个请求之前，我必须将身份验证信息放入标头中。请求完成后，从服务器返回的新访问令牌应该保存到状态中。

所以我的很多动作目前看起来是这样的：

export const asyncAction = (id) => async (dispatch, getState) => {
  const { auth } = getState()
  const config = {
    headers: {
      "access-token": auth["access-token"],
      "client": auth.client,
      "uid": auth.uid
    }
  }
  const request = await axios.get(`${API_URL}`, config)

  dispatch({ type: UPDATE_USER_ACCESS_TOKEN, payload: request})

  dispatch({ type: ANOTHER_ACTION, payload: request.data })
}

我做了一些研究，有两种可能的方法来做到这一点：Axios 拦截器，或者编写一个 Redux 中间件。

我觉得 Axios 拦截器，至少对于响应部分来说，并不是最好的解决方案，因为它只是对响应数据做一些事情，而我需要在完成更新新的访问令牌后调度另一个动作，并且我不想导出商店来手动调度我的操作，这是一种反模式。（正如我提到的流程是：将 auth info 放入 headers => 发送请求 => 如果成功，则将新的 access-token 保存到 Redux 存储以供以后使用，然后调度其他操作；如果失败，进行一些错误处理）。

然后我找到了这个库，但我认为我太笨了，无法理解文档：

https://github.com/svrcekmichal/redux-axios-middleware

有人可以给我一个如何做到这一点的例子吗？使用该库和从头开始编写自定义中间件对我来说都很好。谢谢！

4

0 回答 0