聊聊跨域

2020 / 02 / 06

跨域本身概念非常简单,总的来说不是同一个域就是跨域,包括协议,端口还有域名,二级域和一级域也是跨域,这个限制机制叫做同源策略,跨域更准确的说应该是跨源,那么为什么浏览器会不允许跨域呢。

开发者在构建一个网站的时候,当然不能允许自己的网站的资源被其他的网站的人拿到了,自己的网站拿自己的资源是一件天经地义的事情,而别人跨域取资源就是不合理的了,如果放在十年前,你去问一个开发者为什么浏览器不允许跨域,那么这个开发者可能会反问你,为什么我要允许别人来我家拿东西。当然跨域的产生,更重要的一点是安全性,防止一个网站知道另一个网站的信息。把不同的网站隔离开来。不光包括各种静态资源,图片,脚本等等,还包括cookie, localstorage, indexDB, DOM,以及通过网络请求获取其他源的资源等等。比如页面通过iframe嵌入一个网页,这个时候就能拿到iframe的window实例。那么window.document.getElementById就能拿到别人网页的资源了,这个是非常可怕的事情。如果不限制异步请求跨域,那么,如果别人用ajax请求另外一个网站的html,也会有同样的问题。

然而现在同源策略似乎像空气一样被开发者习以为常了,但却有大量的跨域的需求产生,因为网站不是之前那种资源类的站点,而是多个服务和多个前端界面协作的集合,所以要跨域访问数据变成了一个刚需,所以出现了CORS,而websocket是不限制跨域的,另外除了浏览器端其他端都不限制跨域,因为代理是一个非常有效的解决跨域的方案。

至于script标签为什么可以跨域,是因为多个网站的资源共同协作其实也是非常有必要的,考虑到开发者浏览器允许跨域嵌入资源,除了脚本还有iframe, img, object, video, @font-face等,还有link标签写入css资源也是可以跨域的。而如果不用网页嵌入,用ajax请求这些就会产生跨域问题,所以ajax请求一张图片仍然是跨域的。

写评论
全部评论
暂无评论