开发过程中总能遇到跨域的问题,比如ajax请求跨域,cookie跨域等等。今天总结一下。
跨域是什么?
1.为什么会出现跨域问题?
出现跨域是因为浏览器同源策略。而同源策略呢,又是基于浏览器安全而必须存在的。不然数据无安全性可言。
知识点:同源是指域名,协议,端口相同。
要注意的是同源策略是浏览器行为,由浏览器进行检查限制。限制行为主要有
- Cookie,LocalStorage 和 IndexDB 无法读取。
- DOM 无法获得。
- AJAX 请求不能发送。
虽然这种限制是有必要的,但是在我们需要突破这种限制时的行为就叫跨域。
跨域解决方案
1.在同一个顶级域名下通过设置document.domain。使之归为同源。
2.页面内嵌Iframe想要跨域通信。
- 通过监听片段识别符达到通信的目的。也就是URL #号后边的部分
- 通过监听window.name达到通信的目的。浏览器窗口属性同窗口可以读取。
- HTML5的API window.postMessage方法
//窗口都是通过message事件监听消息
otherWindow.postMessage(message, targetOrigin, [transfer]);
window.addEventListener('message', function(e) {
console.log(e.data);
},false)