vue学习(二)——请求转发解决跨域问题

最新推荐文章于 2024-10-18 10:41:41 发布

相逢太短，莫等茶凉

最新推荐文章于 2024-10-18 10:41:41 发布

阅读量666

点赞数

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/weixin_43849543/article/details/118445621

版权

vue 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何在Vue项目中通过vue.config.js配置代理解决跨域问题。设置devServer的proxy属性，将前端8080端口的请求转发到后端8081端口，实现前端与Node.js服务器的数据交互，确保正常开发和调试。

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

实现目标：vue前端端口号：8080，后端端口号以及目标地址【http://127.0.0.1:8081】

根目录新建文件vue.config.js

配置请求转发解决跨域问题。
请求还是用8080端口（访问网页），但是请求到node.js里面，node.js会给我们请求到8081（拿数据用8081）.

let proxyObj={}

proxyObj['/']={
    //websocket
    ws: false,
    //目标地址,也可以是自己服务器的ip
    target: 'http://127.0.0.1:8081',
    //发送请求host会被设置target
    changeOrigin: true,
    //不要写请求地址
    pathRewrite: {
        '^/':'/'
    }
}

module.exports={
    devServer:{
        host:'localhost',
        port:8080,
        proxy:proxyObj
    }
}