vue vue.config.js 代理不通

vue proxy 代理

 proxy: {
      [process.env.VUE_APP_API]: {
        target: process.env.VUE_APP_BASE_HREF,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_API]: ''
        }
      },
      '/upload-url':{
        target: process.env.VUE_APP_UPLOAD_URL,
        changeOrigin: true,
        pathRewrite: {
          '^/upload-url': '/'
        }
      },
}

一开始我的两个代理这样写，http://192.168.2.150:8063/upload-url/upload%E8%AF%B7%E6%B1%82%E5%9C%B0%E5%9D%80%E6%98%AF%E8%BF%99%E4%B8%AA 但是报下边这个错

  '/upload-url':{
        target: process.env.VUE_APP_UPLOAD_URL,
        changeOrigin: true,
        pathRewrite: {
          '^/upload-url': '/'
        }
      },
      [process.env.VUE_APP_API]: {
        target: process.env.VUE_APP_BASE_HREF,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_API]: ''
        }
      },

后来我只是两个代理的顺序换了下就通了，可以帮忙解释下这是为什么？

可能解决了问题的原因可能是因为路由匹配的顺序问题导致。在 Vue CLI 生成的项目中，通常会有一个名为 index.js 的路由文件，其中定义了路由的顺序。路由匹配会按照定义的顺序进行处理，优先匹配先定义的路由。

• 这有个类似的问题, 你可以参考下: https://ask.csdn.net/questions/7644607
• 这篇博客也不错, 你可以看下vue 清除upload成功上传之后的验证信息
• 除此之外, 这篇博客: 自定义封装upload组件及使用（vue）中的 定义方法 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• methods: {
    init () {
      this.uploadInfo = {}
    },