我的一些配置:
后端项目地址:http://localhost:8088/mySystem/
前端项目地址:http://localhost:8080/
从后端解决,controller中使用@CrossOrigin
,这个方法的粒度比较细,但在controller比较多的时候,用起来比较烦
从前端解决,在Vue cli的配置里面,有一个devServer.proxy,使用它在前段进行一些配置,具体如下:
devServer.proxy:
Type: string | Object
如果你的前端应用和后端 API 服务器没有运行在同一个主机上,你需要在开发环境下将 API 请求代理到 API 服务器。这个问题可以通过 vue.config.js
中的 devServer.proxy
选项来配置。
devServer.proxy
可以是一个指向开发环境 API 服务器的字符串:
module.exports = { devServer: { proxy: 'http://localhost:4000' } }
这会告诉开发服务器将任何未知请求 (没有匹配到静态文件的请求) 代理到http://localhost:4000
。
如果你想要更多的代理控制行为,也可以使用一个 path: options
成对的对象。完整的选项可以查阅 http-proxy-middleware 。
module.exports = { devServer: { proxy: { '/api': { target: '<url>', ws: true, changeOrigin: true }, '/foo': { target: '<other_url>' } } } }