在vue中配置跨域问题:
一:跨域是什么?
跨域问题的出现是因为浏览器的同源策略问题。所谓同源指的是两个页面具有相同的协议(protocol),主机(host),端口(port).同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的文档或者脚本进行交互,这是一个用于隔离潜在恶意文件的重要安全机制。
二:没有同源策略限制的危险场景:
没有同源策略限制的接口请求:
没有同源策略的限制容易导致两个页面同时在被访问时,一个网页通过
后台代码进行窃取个人信息如cookie等。
三:vue中跨域问题的解决
vue将请求发送给本地服务器,本地服务器再发送给真正的后端
在config.index.js的dev中配置:
proxyTable: {
'/api': {
target: 'http://XXXX:9090',//设置你调用的接口域名和端口号别忘了加http
changeOrigin: true, //這裡true表示实现跨域
pathRewrite: {
'^/api':''//在解析域名时会将api用空格代替以进行发送请求
}
}
},
之后便可以使用api/user/add来进行前后端的交互,pathRewrite可以理解为一个重定向的功能