封装axios ,用拦截器做一些事情

比较简单的封装,都在代码里面。
这里后端始终返回200状态码,前端根据自定义的code去做一些事情

import axios from 'axios';
import {Message} from 'antd'
import router from 'umi/router';
export const MethodType = {
  GET: 'GET',
  POST: 'POST',
  PUT: 'PUT',
  DELETE: 'DELETE',
  PATCH:'PATCH'
};
var service=axios.create({
    timeout:5000
})
 //添加请求拦截器
 service.interceptors.request.use(function(config){
    // if(store.getters.token){
    //     config.headers['TOKEN']=getCookie('TOKEN')
    // }
    return config
},function(error){
    return Promise.reject(error)
})
//添加响应拦截器
service.interceptors.response.use(function(response){
   /**
   * 下面的注释为通过在response里,自定义code来标示请求状态
   * 当code返回如下情况则说明权限有问题,登出并返回到登录页
   * 如想通过xmlhttprequest来状态码标识 逻辑可写在下面error中
   */
    const res = response.data
    console.log(res,"lanjieqi")
    if(res.code == '4001'){
     router.push('/login')
    }
  // response => {
  //   const res = response.data
  //   if (res.code !== 20000) {
  //     })
  //     // 50008:非法的token; 50012:其他客户端登录了;  50014:Token 过期了;
  //     if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
  //       }).then(() => {
  //         })
  //       })
  //     }
  //     return Promise.reject('error')
  //   } else {
  //     return response.data
  //   }
  // },
    return response
},function(error){
    console.log('err'+error)
    // Message({
    //     Message:error.message,
    //     type:'error',
    //     duration:5*1000 
    // })
    return Promise.reject(error)
}
)
 
/**
 * 模块说明:有api_token的请求
 */
export let token  = '';
export const request = (api, method = MethodType.GET, params = {}, config = {}) => {
  const apiToken = '************';
  const data = (method === 'GET') ? 'params' : 'data';
  let headers = {
   // 'X-Requested-With': 'XMLHttpRequest',
    'Content-Type': 'application/json',
   // 'Authorization': `${token}`,
  };
  if(api !== '/api/login'){
    headers.Authorization = localStorage.getItem("token")
  }

  if (config.headers) {
    headers = {
      ...headers,
      ...config.headers
    }
  }
  return new Promise((resolve, reject) => {
    service({
      url: api,
      method,
      data: params,
      headers,
    }).then(resolve)
      .catch(error => {
        console.dir(error);
        console.log(error)
        // Message.error(typeof error.response.data === 'string' ? error.response.data : JSON.stringify(error.response.data));
        reject(error);
      });
  });
};

猜你喜欢

转载自blog.csdn.net/weixin_34092370/article/details/86891911
今日推荐