Vue如何通过代理解决跨域问题
**背景:**后端API是用java开发的,前端使用Vue+ele开发的。由于启动Vue的时候会占用一个端口,而后端项目启动后也需要占用一个端口且与前端不同,因此在页面中访问前端的时候就会出现跨域的问题,解决方法比较简单:修改config下的index.js文件:module.exports = {dev: {proxyTable: {'/api': {...
·
背景: 后端API是用java开发的,前端使用Vue+ele开发的。由于启动Vue的时候会占用一个端口,而后端项目启动后也需要占用一个端口且与前端不同,因此在页面中访问前端的时候就会出现跨域的问题,解决方法比较简单:
在config文件夹下的index.js文件中修改:
在module.exports中的添加dev,
module.exports = {
dev: {
proxyTable: {
'/api': {
target: 'http://127.0.0.1:8090',
changeOrigin: true,
// 路径重写: 下面的意思是重写访问路径中的 '/api' 为 '' ,如果没有重写, /api 代表 http://127.0.0.1:8090/api
pathRewrite: {
'^/api': ''
}
}
}
}
}
这样之后再网络访问过程中可直接使用 /api/admin/login 访问 http://127.0.0.1:8090/admin/login,并且不会有跨域问题。
意即代理 /api 代替了 http://127.0.0.1:8090 的服务
更多推荐
已为社区贡献3条内容
所有评论(0)