javascript - 如何处理 axios 中的 401(身份验证错误)并使用react？

Question

我有一个文件 request.js，其中包含 axios ajax 请求的包装器。我正在从多个 react 组件调用请求函数，当其中一个请求失败时，我想刷新 token 并再次重试所有失败的请求。我可以使用拦截器，但我不知道如何实现它。请帮忙。

请求.js

 var client = axios.create({
   baseURL: 'http://192.168.1.3:3000',
     headers: {
     appID: 8,
     version: "1.1.0",
     empID: localStorage.getItem('empID'),
     token: localStorage.getItem('accessToken')
    }
 });

 const request = function(options) {
     const onSuccess = function(response) {
         console.debug('Request Successful!', response);
         return response.data;
     } 
     const onError = function(error) {
         console.error('Request Failed:', error.config);
         if (error.response) {
             console.error('Status:',  error.response.status);
             console.error('Data:',    error.response.data);
             console.error('Headers:', error.response.headers);
         } else {
             console.error('Error Message:', error.message);
         }

         return Promise.reject(error.response || error.message);
     }

     return client(options)
         .then(onSuccess)
         .catch(onError);
         options
 }

 export default request;

Answer 1

如果你想使用拦截器来处理 401 错误，这里是代码片段。

axios.interceptors.response.use(response => {
   return response;
}, error => {
  if (error.response.status === 401) {
   //place your reentry code
  }
  return error;
});