axios全局配置以及拦截器

axios配置
import axios from 'axios'
import { Loading, Message } from 'element-ui';
import store from './store'

let instance = axios.create({
    headers: {
      'content-type': 'application/x-www-form-urlencoded'
    },
    withCredentials:true,
    timeout: 5000

  })


let loading;
function startLoading() {    //使用Element loading-start 方法
    loading = Loading.service({
        lock: true,
        text: '拼命加载中...',
    })
}
function endLoading() {    //使用Element loading-close 方法
    loading.close()
}

//请求数据拦截器
instance.interceptors.request.use(request => {
    startLoading();
    // if (store.state.token) { // 判断是否存在token,如果存在的话,则每个http header都加上token
    //     config.headers.authorization = store.state.token  //请求头加上token
    // }
    return request
}, err => {
    Message.error("请求超时,请稍后重试!")
    return Promise.reject(err);
});

//接收响应拦截器
instance.interceptors.response.use(response => {
    endLoading();
    return response
}, err => {
    if (err && err.response) {
        switch (err.response.status) {
            case 400: err.message = '请求错误(400)'; break;
            case 401: this.$router.push('/login'); break;
            case 403: err.message = '拒绝访问(403)'; break;
            case 404: err.message = '请求出错(404)'; break;
            case 408: err.message = '请求超时(408)'; break;
            case 500: err.message = '服务器错误(500)'; break;
            case 501: err.message = '服务未实现(501)'; break;
            case 502: err.message = '网络错误(502)'; break;
            case 503: err.message = '服务不可用(503)'; break;
            case 504: err.message = '网络超时(504)'; break;
            case 505: err.message = 'HTTP版本不受支持(505)'; break;
            default: err.message = `连接出错(${err.response.status})!`;
        }
    } else {
        err.message = '连接服务器失败!'
    }
    Message.error(err.message);
    return Promise.reject(err);
});

export default instance
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值