美文网首页
vue-cli axios 请求封装(调用接口时长,错误码处理

vue-cli axios 请求封装(调用接口时长,错误码处理

作者: 七號7777 | 来源:发表于2020-03-04 17:00 被阅读0次

    参考大佬git:https://github.com/Nirongxu/nodePlatform-eggjs/blob/master/vue-xuAdmin/src/axios/index.js

    /**
     * Created by WebStorm.
     * User: nirongxu
     * Date: 2019-01-02
     * Description: 文件描述
     */
    import axios from 'axios'
    import Cookies from 'js-cookie'
    import { Message } from "element-ui";
    // axios默认配置
    axios.defaults.timeout = 10000;   // 超时时间
    axios.defaults.baseURL = process.env.API_HOST;
    console.log(axios.defaults.baseURL);
    // 路由请求拦截
    // http request 拦截器
    axios.interceptors.request.use(config => {
        config.headers['Content-Type'] = 'application/json;charset=UTF-8';
        if (Cookies.get('access_token')) {
          //用户每次操作,都将cookie设置成半小时
          // Cookies.set('access_token', Cookies.get('access_token') ,{ expires: 7 });
          config.headers.Authorization = "Bearer" + Cookies.get('access_token')
        }
        return config;
      },
      error => {
        return Promise.reject(error.response);
      });
    
    // 路由响应拦截
    // http response 拦截器
    axios.interceptors.response.use(
      response => {
        // 接口返回的数据,根据需求自行处理(可打印response 看结果)
        if (response.data.code === 11000) {
          // Message({
          //   message: '长时间未操作,请重新登录',
          //   type: 'warning'
          // });
          Cookies.set('access_token', response.data.message ,{ expires: 7 });
          // Cookies.remove('access_token');
          setTimeout(() => {
            location.reload()
          }, 500)
          return Promise.reject()
        }else if(response.data.code === 10000){
          Message({
            message: response.data.message,
            type: 'warning'
          });
          return Promise.reject(response)
        }else {
          return Promise.resolve(response);
        }
      },
    // 请求接口错误时抛出
      error => {
        if (error.response.status === 404) {
          Message({
            message: '请求地址出错',
            type: 'warning'
          });
        }else if (error.response.status === 401) {
          Message({
            message: error.response.data.message,
            type: 'warning'
          });
          Cookies.remove('access_token');
          setTimeout(() => {
            location.reload()
          }, 3000)
          return false
        }
        return Promise.reject(error.response)   // 返回接口返回的错误信息
      });
    export default axios;
    

    相关文章

      网友评论

          本文标题:vue-cli axios 请求封装(调用接口时长,错误码处理

          本文链接:https://www.haomeiwen.com/subject/nqjblhtx.html