同源政策是浏览器实现的一种安全机制，它限制了不同源之间的访问。同源指的是协议、域名、端口号都相同的两个网站，而非同源的网站之间访问会受到限制。这种限制可以有效地防止恶意网站利用脚本窃取用户信息或进行其他有害操作。
但在某些情况下，我们需要跨越不同源来获取数据或调用接口。在这种情况下，我们需要寻找规避同源政策的途径。本文将介绍三种常见的方法：JSONP、CORS、代理服务器。
1. JSONP
JSONP（JSON with Padding）是一种跨域数据传输方式，它利用了 script 标签不受同源政策限制的特性。具体实现方法为，在客户端创建一个 script 标签，并将目标地址作为其 src 属性值。目标地址返回的数据需要以函数调用的形式包裹在回调函数中，如下所示：
<script>
function handleResponse(data) {
// 处理返回数据
}
const script = document.createElement('script')
script.src = 'http://example.com/data?callback=handleResponse'
document.body.appendChild(script)
</script>在服务器端，我们需要按照指定的回调函数名返回数据，如下所示：
handleResponse({"name": "Alice", "age": 18})JSONP 的优点是兼容性好，可以支持老版本浏览器。但它的缺点也比较明显，如只能使用 GET 请求方式、不安全。
2. CORS
CORS（Cross-Origin Resource Sharing）是一种跨域资源共享标准，它需要浏览器和服务器双方配合来实现。在客户端发送请求时，如果目标地址符合跨域条件，浏览器会自动添加特定的请求头。在服务器返回响应时，如果设置了相应的响应头，浏览器就会接受并处理响应数据。具体实现方法为，在服务端加上如下响应头：
Access-Control-Allow-Origin: *
这个头部表示允许任何域名的请求访问该资源。如果想要限制允许访问的域名，可以将 * 替换成指定的域名或 IP 地址。
在客户端发起请求时，需要注意以下几点：
- 如果请求带有 cookie 等敏感信息，需要设置 XMLHttpRequest.withCredentials 属性为 true。
- 如果请求带有自定义请求头，需要在服务器端设置 Access-Control-Allow-Headers 响应头。
- 如果请求包含非简单请求（比如 POST、PUT 等），需要在服务器端设置 Access-Control-Allow-Methods 响应头，以允许这些请求方法。
CORS 的优点是安全，不需要像 JSONP 一样在浏览器中执行不可信代码。但它的缺点也比较明显，如兼容性问题（IE8 和 IE9 不支持 CORS）、无法处理某些类型的请求（如文件上传、WebSocket 等）。
3. 代理服务器
代理服务器是一种将客户端请求转发到目标地址的中间层服务器。我们可以在代理服务器上部署一个接口，用于接受客户端的请求，并将请求转发到目标地址。由于代理服务器和目标地址在同一个域名下，因此不存在跨域问题。具体实现方法为：
-- -------------------- ---- ------- -- ----- ----- ---- - --------------- ----- ------- - ------------------ ----- ------ - ----------------------- ---- -- - ----- --- - -------------------- - ------- - ---------------------------------------------------------- -------- --------------------------------------------------------------------------------
