2

什么是跨域

一般来说,当一个请求url的协议、域名、端口三者之间任意一个与当前页面地址不同即为跨域。

原因

跨域产生的条件:浏览器同源策略限制

浏览器是从两个方面去做这个同源策略的:

  • DOM同源策略。
    禁止对不同源的页面的DOM进行操作,主要包括iframe、canvas之类的。不同源的iframe禁止数据交互的,含有不同源数据的canvas会受到污染而无法进行操作。
  • XmlHttpRequest同源策略。
    简单来说就禁止不同源的AJAX请求,主要用来防止CSRF攻击。

同源策略

同源是指“三个相同”:

  • 协议相同
  • 域名相同
  • 端口相同

clipboard.png

同源策略的限制

  • 存储在浏览器中的数据,如localStroage、Cookie和IndexedDB不能通过脚本跨域访问
  • 不能通过脚本操作不同域下的DOM
  • 不能通过ajax请求不同域的数据

在浏览器中,script,img、iframe、link等标签都可以加载跨域资源,而不受同源限制,但浏览器限制了JavaScript的权限使其不能读、写加载的内容。

跨域的解决方案

  • JSONP
  • CORS
  • document.domain + iframe
  • location.hash + iframe
  • window.name + iframe
  • postMessage
  • nginx代理
  • nodejs中间件代
  • WebSocket

参考链接:
前端常见跨域解决方案(全)
跨域二三事


zhouzhou
1.5k 声望76 粉丝

web前端


« 上一篇
Data URLs

引用和评论

0 条评论