vue 中 require.js 的封装

请求拦截器和响应拦截器,以及 getpost 请求的封装

import axios from "axios";
import qs from "qs";
import store from "../store"

axios.defaults.baseURL="http://localhost:8081"
// var baseURL="http://localhost:5050"
//设置超时时间
axios.defaults.timeout = 10000;
// post请求头
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'
axios.defaults.withcredentials = true

//请求拦截(请求发出前处理请求)
axios.interceptors.request.use((config) => {
    //在发送请求之前如果为post序列化请求参数
    if (config.method === 'post') {
      // config.data = qs.stringify(config.data);
      config.data = config.data;
    }
    if(localStorage.getItem("token")){
        config.headers.token=localStorage.getItem("token");
      }
    if(sessionStorage.getItem("token")){
        config.headers.token=sessionStorage.getItem("token");
      }
    return config;
  }, (error) => {
    return Promise.reject(error);
  });

// 响应拦截器(处理响应数据)
axios.interceptors.response.use((res) => {
    console.log("触发响应拦截器...")
    if(res.data.status==403){
      localStorage.removeItem("token");
      sessionStorage.removeItem("token");
    }else if(res.data.code==-1){
      console.log(55)
      store.commit("setIslogin",false);
      store.commit("setUname","");
      alert(res.data.msg+" 请先登录 !");
    }else if(res.data.token){
      store.commit("setIslogin",true);
      if(res.remember==="true"){
        localStorage.setItem("token",res.data.token);
      }else{
        sessionStorage.setItem("token",res.data.token);
      }
    }
    return res;
  }, (error) => {
    return Promise.reject(error);
  });
// 封装get方法
function get(url, params){
    return new Promise((resolve, reject) =>{
        axios.get(url, params).then(res =>{
            resolve(res.data);
        }).catch(err =>{
            reject(err.data);
        })
    });
}

// 封装post方法
function post(url, params){
    return new Promise((resolve, reject) =>{
        axios.post(url, params).then(res =>{
            resolve(res.data);
        }).catch(err =>{
            reject(err.data);
        })
    });
}

//对外接口
export function request({method, url, data}){
    if(method == 'get'){
        return get(url, data);
    } else if (method == 'post') {
        return post(url, data);
    }
}

export default {
    install(Vue) {
    Vue.prototype.axios = axios;
    Vue.prototype.$request = function () {
            return request;
        }
    }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值