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

最新推荐文章于 2024-05-25 22:13:30 发布

我超幸运12138

最新推荐文章于 2024-05-25 22:13:30 发布

阅读量322

点赞数

CC 4.0 BY-SA版权

文章标签： vue.js 前端 javascript

本文链接：https://blog.youkuaiyun.com/m0_45858045/article/details/133135116

博客介绍了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'
      }
    }
  }
}