JSONP 解决跨域
JSONP跨越的优缺点
- 缺点：JSONP跨域只支持get请求方式同时可能会收到XSS攻击
- 优点：兼容性好
实现过程
- 声明一个回调函数，函数的形参为跨域服务器返回的数据
- 将请求的url赋值给script的src属性，同时将回调函数的名称作为参数传入（通过？传参）
- 服务器需要将回调函数名和返回的数据拼接成字符串返回
- 客户端接收到数据执行回调函数，处理数据
CORS解决跨域
CORS跨域的优缺点
- 优点：支持所有请求方式，保证请求安全性
- 缺点：不支持IE8以下浏览器
实现
- 主要由后端实现，服务器设置 Access-Control-Allow-Origin ,该属性表示允许哪个域名访问,*代码允许所有
- 前端发送post请求时需要设置Content-Type 为application/x-www-form-urlencoded
postMessage解决跨域
postMessage()是html5提供的API
// 参数1: 传递的数据
// 参数2: 请求的协议+域名+端口号+[url],字符串形式
// 参数3: 可选参数,Transferable对象,该参数会将Transerable对象的所有权转移给接收方,发送方失去控制权
otherWindow.postMessage(message,targetOrigin,[transfer])
复制代码转载于:https://juejin.im/post/5ceba7b4f265da1b916371af