为了保证用户信息的安全,防止恶意网站窃取数据,浏览器拥有一项同源策略。
同源策略规定,不同源的站点在 LocalStorage、SessionStorage、IndexDB、DOM上不能共享,AJAX请求不能发送。
两个站点同源,具体是指 协议+域名+端口号 要相同。
但是如果我们的一些这正常合法的逻辑中需要跨源通信或共享资源该怎么办呢?
如果是共享存储内容(cookie、LocalStorage、SessionStorage)可以使用 postMessage
postMessage的使用方法为:
假定 A标签页需要 与 B标签页进行通信
A要主动打开B并获取B的引用
A在某个需要的时候使用 postMessage 给 B 发送内容
B则对“message”事件进行监听,并设置回调函数
如果是要像不同源的站点发送AJAX请求,可以采用以下几种方法:
(1)使用代理
(2)CORS 跨源资源共享
(3)jsonp 即 利用 <script> 的 src 不受跨源策略的限制的应用
(4)图片探测 即 利用 <img> 的src 不收跨源策略的限制的应用