二次封装axios,以及各个环境基础路径的使用

import axios from 'axios'
import qs from 'qs'
import { VALID_LOGIN,FIND_TREE_BY_PIDl } from './urls'   //引入判断权限、获取信息的接口
import {MessageBox} from 'element-ui'

axios.defaults.crossDomain = true;
axios.defaults.withCredentials = true; //设置cross跨域 并设置访问权限 允许跨域携带cookie信息
axios.defaults.baseURL = process.env.VUE_APP_API_BASE_URL;  // 配置axios请求的地址
axios.defaults.timeout = 600000;


// axios interceptor
// 发请求之前先执行
axios.interceptors.request.use(
  config => {
    config.headers["userName"]='xxxxxxx'  //若所有的接口中都需要某个字段,可放在请求头中
    return config
  },
  error => {
    console.log(error)
    return Promise.reject(error)
  }
)
// response interceptor
// 请求成功之后先执行(页面还没拿到数据)
axios.interceptors.response.use(
  response => {
    return response
  },
  error => {
    let status = error.response.status
    if(status==401 || status == 403 ){
      selectPlate();
    }
    return Promise.reject(error)
  }
)
//若没有关闭体统,登录用户发生改变,改变地址栏的地址
function updatedHref(){
    post(FIND_TREE_BY_PIDl, { type: 1 }).then(res => {
      if (res.status == 1) {
        let staffName = res.data.msg.staffName;
        let str = location.href;
        const regex = /\?(.*)#/;
        let newStr = str.replace(regex, `?userName=${staffName}#`);
        history.replaceState(null, null, newStr);
      }
    });
}
//判断是否登录或者访问权限
function selectPlate(){
   post(VALID_LOGIN).then((res)=>{
     if(res.data.status==1){
      MessageBox.confirm('您没有当前菜单的访问权限,请联系管理员!','提示',{
        confirmButtonText: '确定',
      }).then(()=>{
        window.close();
      })
     }else if(res.data.status== -1){
      MessageBox.confirm('您已掉线,请先登录!','提示',{
        confirmButtonText: '确定',
      }).then(()=>{
        localStorage.clear();
        window.close();
      })
     }
   })
}

var test2 = setInterval(function () {
    testSelectPlate();
    updatedHref();
}, 5000);


//登录失效
function testSelectPlate(){
  post(VALID_LOGIN).then((res)=>{
    if(res.data!=null && res.data.status!=1){
      clearInterval(test2)
     MessageBox.confirm('登录已失效,关闭窗口重新登录','提示',{
       confirmButtonText: '确定',
          cancelButtonText: '取消',
     }).then(()=>{
      localStorage.clear();
       window.close();
     }).catch(()=>{
      window.location.reload()
      test2 = setInterval(function () {
        testSelectPlate();
        updatedHref();
    }, 5000);
     })
    }
  })
}
/**
 * 封装get请求
 * @param url
 * @param data
 * @returns {Promise}
 */
export function fetch(url, params = {}) {
  return new Promise((resolve, reject) => {
    axios.get(url, {
      params: params
    })
      .then(response => {
        resolve(response.data);
      })
      .catch(err => {
        reject(err)
      })
  })
}

/**
 * 封装post请求
 * @param url
 * @param data
 * @returns {Promise}
 */

export function post(url, data = {}) {
  return new Promise((resolve, reject) => {
    axios.post(url,
      qs.stringify(data, { arrayFormat: 'repeat' }), {
        headers: {
          "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8"
        }
      }
    )
      .then(response => {
        resolve(response.data);
      }, err => {
        reject(err)
      })
  })
}
/**
 * 封装post请求
 * @param url
 * @param data
 * @returns {Promise}
 */

export function postjson(url, data = {}) {
  return new Promise((resolve, reject) => {
    axios.post(url, JSON.stringify(data), {
      headers: {
        "Content-Type": "application/json;charset=utf-8"
      }
    })
      .then(response => {
        resolve(response.data);
      }, err => {
        reject(err)
      })
  })
}

/**
* 封装patch请求
* @param url
* @param data
* @returns {Promise}
*/

export function patch(url, data = {}) {
  return new Promise((resolve, reject) => {
    axios.patch(url, data)
      .then(response => {
        resolve(response.data);
      }, err => {
        reject(err)
      })
  })
}

/**
* 封装put请求
* @param url
* @param data
* @returns {Promise}
*/

export function put(url, data = {}) {
  return new Promise((resolve, reject) => {
    axios.put(url, data)
      .then(response => {
        resolve(response.data);
      }, err => {
        reject(err)
      })
  })
}

在env.dev  env.pro  env.test 文件中写入地址

下面以dev环境为例

NODE_ENV=dev
VUE_APP_API_BASE_URL=https://xxxx/xxx

url.js文件

export const VALID_LOGIN = '/appmanage/public/common/validLogin';
export const FIND_TREE_BY_PIDl='/appmanage/public/common/findTreeByPid';

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值