同源策略

浏览器的一种安全机制，限制来自不同源的文档或脚本之间的交互。
“同源” 要求 协议、域名、端口 三者完全相同

什么东西不受同源策略限制？

1. 加载图片/CSS/脚本（<script>、<img>、<link> 等标签）
2. @font-face
3. <form>
4. WebSocket

如何绕过同源策略实现跨域请求？

JSONP

利用 script 标签不受限制的特点，将服务器返回的数据作为 JS 函数来执行

限制

1. 仅支持 GET 请求（script 标签）
2. 安全风险，可能被中间人攻击，执行恶意代码
3. 只能处理 JSON 格式数据
4. 还需要传递回调函数的名字

CORS

通过 HTTP 头部（如 Access-Control-Allow-Origin）由服务端声明允许跨域的源，浏览器解除限制

服务端需要根据请求头 Origin 动态设置 Access-Control-Allow-Origin（白名单校验）

CORS preflight

预检请求是一种 OPTIONS 请求，用于在实际发送 GET 或 POST 请求之前检查服务器是否允许跨源请求。它询问服务器是否接受来自某个源的请求、可使用的方法和头部信息等

反向代理

网页请求代理服务器，代理服务器负责将请求转发到对应的服务器，并返回请求到的资源

postMessage

目标窗口监听 message 时，需要对 event.origin 做验证

document.domain

仅限主域相同的情况（比如 aaa.domain.com 和 bbb.domain.com）

通过设置 document.domain 为相同主域，实现子域之间的跨域访问（需双方页面都设置 document.domain）