跨域
跨越 区域(范围)
浏览器为保证数据安全 设立了一种安全策略 —— 同源策略
同源策略的核心思想是 一个页面无法访问跨源(域)的数据
1.Cookie 、LocalStorage 和 IndexDB 无法读取
2.Dom 和 JS 对象无法获取
3.Ajax请求发送不出去
同源：有三个条件需要同时满足 才叫同源
- 相同的协议 ( http:// https:// )
- 相同地址(ip / 域名)
- 相同端口
跨源(跨域)解决方案
- JSONP
//原生的实现方式
let script = document.createElement('script');
script.src = 'http://www.xxxx.com'
document.body.appendChild('script')
function callback(res) {
console.log(res)
}
- 跨域资源共享(CORS) 是一个W3C标准，全称（Cross-origin resource sharing）,她是允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。
1、请求方式为HEAD、POST 或者GET
2、http头信息不超出以下字段：Accept、
- 反向代理 使用代理 使用web服务器代理请求地址
devServer:{
proxy:{
"/api" : {
target:'http://192.168.50.127:8082',
changeOrigin:true,
pathRewrite:{
['^' + '/api'] : ''
}
}
}
}
JSONP和JSON 没有关系
JSONP是一种社区跨域解决方案(不属于语言标准)
JSONP不属于任何标准 依赖某些可以跨域的属性实现功能
JSONP实现跨域的核心思路是：
动态的创建script元素 将需要请求的路径写在src属性中
利用src属性不受同源策略限制的特点发送get请求
请求的结果会被浏览器识别是js代码 执行得到结果
src属性不受同源策略的限制：可以使用带有src属性的元素来发送请求 请求的类型get
例如：
<img src="">
<iframe src="">
<script src=""></script>
