[JavaScript知识库]vite.config.js如何配置多个跨域

?vue3.0根目录下vue.config.js文件

export default defineConfig({
  server: {
    proxy: {
      // 字符串简写写法
      '/foo': 'http://localhost:4567',
      // 选项写法
      '/api': {
        target: 'http://',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      },
      // 正则表达式写法
      '^/fallback/.*': {
        target: 'http://',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/fallback/, '')
      },
      // 使用 proxy 实例
      '/api': {
        target: 'http://',
        changeOrigin: true,
        configure: (proxy, options) => {
          // proxy 是 'http-proxy' 的实例
        }
      }
    }
  }
})

需要注意的是:我刚开始这样配置

 server: {
    proxy: {
      "/api": {
        target: 'http://39.',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, '')
      },
      "/api2": {
        target: 'http://10.',
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api2/, '')
      }
    },
  },

结果是配置跨域不成功，因为 rewrite是重置路径的后面的正则回匹配到api开头的所以第一个把第二个跨域覆盖了，所以改成两个不一样开头的名字就可以了