vue自定义全局设置

最新推荐文章于 2023-07-05 22:28:57 发布

LLL_LH

最新推荐文章于 2023-07-05 22:28:57 发布

阅读量696

点赞数

CC 4.0 BY-SA版权

分类专栏： webpack

本文链接：https://blog.youkuaiyun.com/LLL_liuhui/article/details/104675041

webpack 专栏收录该内容

14 篇文章

订阅专栏

vue2.x中在static下新建一个serverConfig.js,vue3中在public下新建一个serverConfig.js

const win = window || global
win.apiConfig = {
  developmentURL: 'http://192.168.0.101:8080/wx/', 
  productionURL: 'http://xxxxx.cn/api'
}

然后在index.html页面里面引入js.

在axios全局设置js里，设置baseURL

// import axios from 'axios';
import Nprogress from '@/plugin/Nprogress'
import store from 'store/'
import router from '@/framework/router'

axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
let apiURL = ''
if (process.env.NODE_ENV === 'production') {
  apiURL = window.apiConfig.productionURL
} else if (process.env.NODE_ENV === 'development') {
  apiURL = window.apiConfig.developmentURL
} else {
  apiURL = window.apiConfig.textURL
}

axios.defaults.baseURL = apiURL;

axios.defaults.withCredentials = true;

axios.interceptors.request.use(
  config => {
    //根据参数判断是否在header添加Authorization/token
    config.headers.token = store.state.token || '';
    config.headers.userclient = '1';
    Nprogress.start();
    return config
  }, error => {
    return Promise.reject(error);
  }
);
axios.interceptors.response.use(response => {
  // 统一处理返回状态
  Nprogress.done();
  if (response.data.code == -3) {
    sessionStorage.clear();
    router.push('/');
    return;
  }
  return response.data;
}, error => {
  console.log(error)
  // let err = error.response.data;
  Nprogress.done();
  /* if(document.querySelector('.notify')){
       return;
   }*/

});
export default axios;

这样就不需要设置跨域了，

// 跨域服务器代理 ^ 5.0.3
// app.use(
//   '/api', proxy(
//     {
//       target: 'http://xx.cn/api',
//       changeOrigin: true,
//       pathRewrite: {
//         '^/api': ''
//       }
//     }
//   ));

以后如果需要修改服务器域名，就只需要设置serverConfig.js。