vue解决跨域：使用proxy进行反向代理

原创于 2023-09-21 15:21:49 发布 · 323 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

博客介绍了Vue解决跨域的方法，即使用proxy进行反向代理。还提到配置axios，以及使用cli创建Vue项目后，在根目录创建vue.config.js文件并写入代码，配置结束需重启项目。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue解决跨域：使用proxy进行反向代理

配置axios

在这里插入图片描述

使用cli创建vue项目，在根目录下创建文件名为vue.config.js的文件，然后写上下面的代码

module.exports = {
//只要路径中出现‘/proxy’就会访问目标路径  traget对应的路径
  devServer: {
    proxy: {
      '/proxy': {
        target: 'http://localhost:7788',
        ws: true,
        changeOrigin: true,
        pathRewrite:{ //路径重写  必须重写，因为你的路径中不需要出现这个‘/proxy’
             '^/proxy':''
         }
      },
      
      '/foo':{
          target:'http://localhost:3001'
      }
    }
  }
}