同源策略及跨域技术

一、同源策略（same-origin policy ）

　　一种浏览器安全机制，是浏览器为了防止页面内的脚本被用于恶意目的而遵循的一种机制。即页面内的脚本访问资源时，必须保证页面和资源的来源相同。浏览器通过统一资源标识符（URI）的协议、域名以及端口号是否完全一致来判断二者是否同源【用于计算 URI 的“来源”的算法在 RFC 6454 第 4 节中指定】。

　　判断两个网络资源是否同源，可以参考阅读：浏览器和服务器实现跨域(CORS)判定的原理 https://blog.csdn.net/zmx729618/article/details/53319383

　　同源策略，对于 “依赖 http cookie 来维护授权用户 session 的” Web应用程序来说，具有特殊意义。因为这些 服务器上的Web应用程序，将根据 http cookie 信息进行敏感数据的操作。所以，客户端必须维护“无关来源之间的”严格分离，以防止丢失数据机密性和完整性。

　　同源策略可防止跨源重用经过身份验证的 session 。举个例子，假设在没有同源策略的情况下，用户正在访问银行网站并且没有注销，然后，用户转到另一个站点，该站点包含恶意 JavaScript 代码（可以执行“用户在银行站点上可执行的”任何操作）【虽然 JavaScript 确实无法直接访问银行 session cookie，但它仍然可以使用银行站点的 session cookie 向银行站点发送和接收请求】。

　　同源策略仅适用于脚本【Javascript】。这意味着通过 HTML 标签可以跨源访问另一来源的图象、CSS和动态加载脚本等资源。同源策略不适用于 HTML 标签（<script>、<link>、<img> 三个），一些攻击就是利用了这一特性而被发起进行的。

　　同源策略的概念是在 1995 年由 Netscape Navigator 2.02 版本引入的，旨在保护脚本对 DOM 的访问，但后来扩展到保护全局 “JavaScript 对象” 的敏感部分。之所以引入同源策略，是因为不久前的2.0版本支持在网页上编写脚本，特别是对文档对象模型 (DOM) 的编程访问。

　　所有现代浏览器都实现了某种形式的同源策略，因为它是重要的安全基石。

　　后来，同源策略被扩展，以定义大致兼容的安全边界【译者注：边界外不安全】，而应用到了其他web技术上，比如，Microsoft Silverlight、Adobe Flash 或 Adobe Acrobat，或者应用到了其他机制上，如 XMLHttpRequest。　　

二、放宽同源策略

　　在某些情况下，同源策略过于严格，会给使用多个子域的大型网站带来问题。因此，产生了“合法的”跨域的需求，具体跨域技术，可以参考阅读：

　　解锁跨域的九种姿势：https://juejin.cn/post/6844903767507206151#heading-7

　　前端多种跨域方式实现原理详解：https://segmentfault.com/a/1190000022304066

1.数据污染

　　开启后，浏览器会询问用户是否允许有问题的访问。

2.document.domain属性

　　如果两个窗口（或框架）包含将 domain 设置为相同值的脚本，则对这两个窗口放宽同源策略，并且每个窗口可以相互交互。 例如，从orders.example.com 和catalog.example.com 加载的文档中的协作脚本可能会将其document.domain 属性设置为“example.com”，从而使文档看起来具有相同的来源并使每个文档都可以阅读 对方的属性。

3.跨源资源共享（CORS）

　　跨源资源共享，另一种放宽同源策略的技术，标准化的跨源访问方式。CROS扩展了 HTTP 协议，浏览器发现某页面需要跨源访问时，使用 Origin 请求标头寻问被访问的资源所在的服务器，服务器使用 Access-Control-Allow-Origin 响应标头回答寻问，标头明确列出可能请求文件的来源，或使用通配符以允许任何站点请求文件。

　　关于CORS，可以参考阅读：跨域资源共享 CORS 详解 http://www.ruanyifeng.com/blog/2016/04/cors.html。

4.JSONP

　　由于允许 HTML <script> 元素从其他域检索和执行内容，因此页面可以通过它绕过同源策略。