搞清概念
跨域: 前端网页通过浏览器去请求另一个域名的资源时,域名、端口、协议有一个不同,都是跨域
举例: data-center-vue项目的前端服务 跑在8080端口下,后端项目跑在5000端口下,那么前端在请求后端接口的时候就会出现跨域问题。
同源策略: 出现跨域问题的原因来源于 JavaScript 的同源策略。即只有 协议+主机名+端口号(如存在)相同,则允许相互访问
跨域问题是针对JS和ajax的。而axios是通过Promise实现对ajax技术的一种封装,也同样存在跨域问题。Promise是 JavaScript 中标准的内置对象。
解决方案
在vue2项目中,axios请求出现的跨域问题
在vue.config.js文件中配置以下参数
然后在请求的axios中写
修改完vue.config.js文件后,要重启项目,否则修改不会生效
axios.get("/api/energy/get_energy_station_kpi?system_id=2")
.then(res => { console.log(res) })
.catch(err => { console.error(err); })