VUE项目,连接多个服务器

需求:根据不同的接口与不同的服务器做交互

1:

封装axios处

 const baseURL = '/login'
// 创建axios实例
const service = axios.create({
  baseURL: baseURL, // api 的 base_url
  timeout: Config.timeout, // 请求超时时间
  withCredentials: true
})

2:vue.config.js中

  devServer: {
    port: 8005,
    proxy: {
      // 第一台服务器配置 
      '/login/auth': {
        target:'http://192*********:9525',///这里填写项目真实的后台接口地址
        pathRewrite: { '^/login/auth':  '/auth' },
        changeOrigin: true //设置允许跨域
      },
      '/login/': {
        target:'http://12*******30:9525',//这里填写项目真实的后台接口地址
        pathRewrite: { '^/login/':  '' },
        changeOrigin: true //设置允许跨域
      },


    }

   } ,

注:如果路由是hash,封装axios的baseURL可以是空,在vue.config里就不需要要有login的前缀了,如果是history,就不能让baseURL为空(刷新页面时找不到页面,会抛错)

Guess you like

Origin blog.csdn.net/weixin_48091030/article/details/130527271