在 Web 开发中，跨域资源共享 (CORS) 是一种重要的策略，用于限制浏览器的跨域请求。然而有时候，我们需要跨域访问其他网站的资源，这就需要绕过 CORS 访问控制来允许来自指定的源访问。
什么是 CORS？
CORS 是浏览器实现的一种安全策略，用于防止恶意网站攻击其他网站。在架构上，CORS 基于 HTTP 头部，通过在响应头中添加 Access-Control-Allow-Origin 字段来告知浏览器允许的请求源。例如：
Access-Control-Allow-Origin: https://example.com
这表示只允许来自 https://example.com 源的请求访问此资源。如果请求源与允许的源不匹配，则浏览器将拒绝该请求。
如何绕过 CORS 访问控制？
有多种方法可以绕过 CORS 访问控制，下面介绍其中两种。
使用代理服务器
我们可以通过代理服务器将请求发送到目标服务器，然后将响应返回给客户端。由于代理服务器在另一个域上运行，所以它不受浏览器的同源策略限制。客户端只需要向代理服务器发出请求即可。
以下是一个使用 Node.js 实现的简单代理服务器：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------- - -------------------
----- ---- - -----
----- --------- - ----------------------
----------------------- ---- -- -
----- ------- - -
---- --------- - --------
-------- -
------------- ---------
-
--
---------------------------
--------------- -- -- -
------------------ ------ --------- -- ---- ----------
---在此示例中，我们使用 request 模块将请求发送到目标 URL，并将响应流式传输回客户端。然后，我们可以在客户端代码中指定代理服务器地址：
const apiUrl = 'http://localhost:8080/api/data';
fetch(apiUrl).then(response => {
// 处理响应数据
});这样客户端请求就会被发送到代理服务器上，然后由代理服务器转发到目标服务器上，最终将响应返回给客户端。
JSONP
另一种常见的绕过 CORS 的方法是使用 JSONP。JSONP (JSON with Padding) 是一种使用 JavaScript 动态加载数据的技术。具体来说，它通过向另一个域发送包含回调函数名的 GET 请求来获取 JSON 数据，并将其包裹在该函数中返回给客户端。例如：
function processData(data) {
// 处理数据
}
const script = document.createElement('script');
script.src = 'https://example.com/api/data?callback=processData';
document.head.appendChild(script);在此示例中，我们向 https://example.com/api/data 发送 GET 请求，并指定回调函数名称为 processData。目标服务器将返回以下数据：
processData({ "name": "John", "age": 30 });浏览器将此响应解释为 JavaScript 代码，并执行其中的 processData 函数。
虽然 JSONP 可以绕过 CORS 访问控制，但它也存在一些安全风险。例如，由于 JSONP 使用的是 GET 方法，所以请求 URL 中暴露了敏感信息，可能被攻击者利用。因此，JSONP 应该谨慎使用。
总结
在 Web 开发中，CORS 是一种重要的安全策略，用于限制浏览器的
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/9800
