Vue 多域名跨域_vue3如何实现不同域名认证-CSDN博客

本文链接：https://blog.csdn.net/xingchen678/article/details/106047748

直接上代码：

assetsSubDirectory: "static",
    assetsPublicPath: "/",
    proxyTable: {
      "/api": {
         target: "path1", 
        changeOrigin: true, //改变源
        pathRewrite: {
          "^/api": "/" //路径重写
        }
      },
　　　　// 此处若使用 "/api1" 类似命名可能会导致请求时只截取api部分接口出现404错误，因此命名时尽量避免此类命名方式。
      "/mzyl": {
        target: 'path2', //源地址
        changeOrigin: true, //改变源
        pathRewrite: {
          "^/mzyl": "/" //路径重写
        }
      }
    },

重点警告：

第一个写了，api，第二个就不要包含api字样，比如：api2，这样会导致只有一个生效，另一个报错或404。

2、配置中主要参数说明：

'/api'

捕获API的标志，如果API中有这个字符串，那么就开始匹配代理，
比如API请求/api/users, 会被代理到请求 http://www.baidu.com/api/users 。

target

代理的API地址，就是需要跨域的API地址。
地址可以是域名,如：http://www.baidu.com
也可以是IP地址：http://127.0.0.1:3000
如果是域名需要额外添加一个参数changeOrigin: true，否则会代理失败。

pathRewrite

路径重写，也就是说会修改最终请求的API路径。
比如访问的API路径：/api/users,
设置pathRewrite: {'^/api' : ''},后，
最终代理访问的路径：http://www.baidu.com/users，
这个参数的目的是给代理命名后，在访问时把命名删除掉。