使用 javascript 设置响应标头

Posted 2023-03-04

【中文标题】使用 javascript 设置响应标头

【英文标题】：Setting response header with javascript

【发布时间】：2013-08-02 03:12:38

【问题描述】：

我在从应用程序中的 URL 收集 json 值时遇到问题。当我尝试获取它们时，控制台中会显示一条错误日志，说明 access-control-allow-origin 不允许来源。

我研究了一下，发现响应头必须设置为 Access-Control-Allow-Origin: *

如何使用纯 javascript 做到这一点？没有 jquery 或任何其他库。

这是我当前的代码：

<script type="text/javascript">
    var xmlHttp = null;
    xmlHttp = new XMLHttpRequest();
    xmlHttp.open( "GET", "http://example.com/id=69", false );
    xmlHttp.send( null );
    console.log("JSON values from URL: ");
    console.log(xmlHttp.responseText);
</script>

【参考方案1】：

您不能在客户端执行此操作，您的服务器必须发送这些标头。

【参考方案2】：

我研究了一下，发现响应头必须设置为 Access-Control-Allow-Origin: *

如何使用纯 javascript 做到这一点？没有 jquery 或任何其他库。

您不能，除非您的 服务器 正在运行 JavaScript（NodeJS 等）。

服务器 必须允许从文档来源访问资源。它的工作方式是：

浏览器请求访问资源的权限（这称为“预检”请求），告诉服务器它想要访问什么资源，等等。

服务器以适当的标头回复，告诉浏览器是否允许访问。

浏览器发送实际请求。

服务器对其进行响应（再次包括相关的标头）。

我相信在某些情况下不需要进行预飞行。所有这些都由XMLHttpRequest 对象为您处理。

the Cross-Origin Resource Sharing specification 中的详细信息。

【讨论】：

我的服务器正在运行 NodeJS。那我可以设置响应头吗？

@MarkoĆilimković：当然，在服务器上的代码中使用response.setHeader。 CORS 非常挑剔，您需要确保您允许客户端要求的所有内容，这意味着检查浏览器发送的请求标头。

感谢您的解释！

@T.J.Crowder 这个浏览器扩展解决了客户端的 CORS 策略问题。如何在没有扩展名的情况下完成chrome.google.com/webstore/detail/allow-control-allow-origi/…

@T.J.Crowder 我的意思是扩展程序也在客户端使用 javascript，但仍然能够覆盖 CORS 问题。那么，为什么它不能在 html 页面中使用 javaScript 完成。