使用JavaScript设置响应头信息

Question

我在我的应用程序中遇到了从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>

- Marko Ćilimković

Answer 1

我做了一些研究，发现响应头必须设置为Access-Control-Allow-Origin: *。我如何使用纯Javascript实现呢？不使用jquery或其他任何库。
你无法这样做，除非你的服务器运行JavaScript（NodeJS等）。
服务器必须允许从文档的来源访问资源。其工作方式是：

• 浏览器请求访问资源的权限（这称为“preflight”请求），告诉服务器它要访问的资源等。
• 服务器用适当的标头回复，告诉浏览器是否允许访问。
• 浏览器发送实际请求。
• 服务器对其进行响应（再次包括相关标头）。

我相信有些情况下不需要预检。所有这些都由XMLHttpRequest对象为您处理。
在跨源资源共享规范中详细说明。

- T.J. Crowder

---

我的服务器正在运行NodeJS。我可以设置响应头吗？ - Marko Ćilimković

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

@T.J.Crowder 这个浏览器扩展程序可以在客户端解决CORS策略问题。不使用扩展程序该如何实现呢？https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en-US - Satinderpal Singh

@T.J.Crowder 我的意思是，该扩展程序也在客户端使用 JavaScript，但仍能覆盖 CORS 问题。那么，为什么不能在 HTML 页面中使用 JavaScript 来完成呢？ - Satinderpal Singh

@SatinderBajwa - 因为扩展可以做网页代码无法完成的事情。 - T.J. Crowder

Answer 2

您无法在客户端执行此操作，必须由服务器发送这些头部信息。

- mguimard