#同源策略与跨域

#1. 同源策略

同源策略是浏览器的一项核心安全模型。它要求一段脚本仅能访问与其具有相同来源层的资源与数据。

同源的定义： 两个 URL 必须满足以下三个条件完全相同：

1. 协议 (例如 http 与 https 不同源)
2. 域名 (例如 www.domain.com 与 api.domain.com 不同源)
3. 端口 (例如 80 与 8080 不同源)

如果没有同源策略的环境保护，用户在访问不合规格操作网页时，恶意网站内部所请求的脚本即可能去读取和篡改网银等其余页面标签存储所特设认证记录的关联储存凭证与资料。

#2. 跨域方案

同源策略作为严格的基础规则同时也会经常存在必须调用请求的限制业务矛盾。以下列举通常实用的跨域通讯架构方案层级设计手段：

#(1) CORS 跨域资源共享

CORS 是跨域的首选官方标准方案技术。它通过服务器侧配置对应的判定放行信息，让浏览器查验后批准放行接口调用。其核心原理依赖服务器声明 Access-Control-Allow-Origin: * 或者对应特定的安全限定请求原域范围来进行授权。涉及较复杂动作操作时，预先发生 OPTIONS 预检请求向服务端校验身份。

#(2) JSONP

在对历史系统兼容时，经常采用脚本原生 <script src=""> 标签引入无视域源限制机制，进行简单回调传输规避使用。 服务器用该对应的包裹名包裹后直接生成包含真实传递的数据体字串完成函数参数运行。 此方法的机制天生限制：受制于该方案标签天然操作限制，只能用且通过发起 GET 类型参数行为且并无法进行大范围主体数据的推送传输方式。

#(3) 服务端代理环境部署

同源阻断特性基于的是纯前端发起时的核心检查层，服务端之间的基础内网转寄通常并不干涉此类判断。 在系统结构层面配置，通过前置应用发起相对环境内部本身无限制的中间代理层请求（例如 Nginx ，Node 架构转接端）。利用后端完成远程处理目标信息再向本地进行包装处理回传即可。

#(4) postMessage

面对不同系统直接层级下关联操作页（多窗，或涉及在 iframe 中隔离呈现架构的关联界面体系时），彼此需要交互联动信息或互相派发反馈的状况结构下使用原生支持的 window.postMessage 处理交互机制。此标准体系可以在特定的源指向检验目标授权保障下提供直接传参跨页环境跨度直接互唤联动传递方式。