vue axios api拆分以及axios token验证配置

vue学了两天,就被拉起来搭框架 ,说实话有点懵,一边查资料,一边加入点自己得思路终于勉强搞定。

axios配置

import axios from 'axios';
import {router} from '../router/index';
import { Message } from 'element-ui';
export let configtoJson={ //JSON格式数据
  headers: {
    'Content-Type': 'application/json',
  }
}
export let configtoFormData={ //formData格式
  headers: {
    'Content-Type': 'multipart/form-data',
  }
}



//设置全局请求超时时间
axios.defaults.timeout=12000
//设置全局token,登陆用
export  function setToken(token){
  return  axios.defaults.headers.common['token'] = token;
}
// request拦截
axios.interceptors.request.use(
  config => {
  //不想被拦截得话,悄悄咪咪加个token上去
   //config.headers.common['token']="JIx6uaDK3ZMR5ZPwSnQnsg=="

    return config;
  }, function (err) {
    console.log("超时")
    return Promise.reject(err);
  });


//token过期 拦截在消息抵达之前做点什么--,
axios.interceptors.response.use(function (response) {
  //  用户信息是否超时,重定向到登录页面
  if (response.data.msg == '999'){
    axios.defaults.headers.common['token'] = '';
    var storage = window.localStorage;
    storage.clear();
    router.replace("/login")
    Message({message:"用户信息失效,请重新登陆",center:true,type:'warning'})
    return Promise.reject("用户信息失效,请重新登陆")
  }
  //redis 超时
  else if(response.data.msg == '888'){
    Message({message:"服务器连接超时",center:true,type:'warning'})
    return Promise.reject("服务器连接超时")
  }
  else{
    return response}
}, function (error) {
  return Promise.reject("反正就是服务器出啥错了")
})

根据模块拆分的api

//考勤设置
import axios from 'axios';
import {base, configtoJson, configtoFormData} from './api';
//JSON格式数据 api.configtoJson
//formData数据格式 api.configtoFormData


  //获取公司列表
  export const queryCompanyList = params =>{
    return axios.post(`${base}/url`,params,configtoJson)
    .then(res => res.data);
  };

接下来就是引入到你的页面直接调用啦。。。。

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值