什么是跨域
网络间的通信有同源策略,从一个源加载的脚本或文件如何和另外一个源的脚本进行交互。这是用于隔离潜在恶意文件的的关键安全机制
同源:是指主机名,协议,端口组成组合必须相同,不同源的话会Cookie,localStorage,IndexDB无法读取,DOM无法获得,AJAX不能发送请求
前后端通信
1:ajax 2:webSocket(不受同源策略限制) 3:CORS(新的通信标准)
跨域的几种方式:
1: JSONP 2:Hash 3:postMessage(HTML5) 4:webSocket 5;CORS
- JSONP 利用script的标签的异步加载特性特性实现,给服务器传一个回调函数,服务器执行完后返回一个传递过去的回调函数的js代码
- Hash 是页面嵌套 在目标页面进行onhashchange 监控
- postMessage(),窗口A(http:A.com)向跨域的窗口B(http:B.com)发送信息 例如 3.3
- websocket var ws = new WebSocket("wss://self.org") 监听 onOpen onMessage onClose事件
- HTML5的fechtch API
- 后台配置
- form 直接进行表单提交
- cors http://www.ruanyifeng.com/blog/2016/04/cors.html
例子3.3 窗口A(http:A.com)向跨域的窗口B(http:B.com)发送信息
BWindow.postMessage('data','http://B.com')
Awindow.addEventListener('message',funciton(event){
console.log(event.origin)
console.log(event.source)
console.log(event.data)
})
网友评论