1.跨域问题

​ 由于浏览器的同源策略限制,浏览器会阻止一个域的javascript脚本和另一个域的内容进行交互

​ 同源需要要求两个页面有==同样的协议==,==主机==,==端口号==。

2.解决方式

如果你的前端应用和后端 API 服务器没有运行在同一个主机上,你需要在开发环境下将 API 请求代理到 API 服务器。这个问题可以通过 vue.config.js 中的 devServer.proxy 选项来配置。(vue官方文档中)

通过代理的方式,将本地请求转发到目标url上

1
2
3
4
5
6
7
8
9
10
11
12
13
14
module.exports = {
devServer: {
proxy: {
'/api': {
target: '<url>',
ws: true,
changeOrigin: true
},
'/foo': {
target: '<other_url>'
}
}
}
}

如上文所示,在请求路径有/api时,就会自动转发到<url>

同时也可以对/foo进行设置

==上述代码需要自己在项目中创建 vue.config.js文件==写入配置