仅使用 javascript 更改 CORS 策略？ [复制]

Question

我有一个想法，有一个 webapp 可以帮助我改进我的前端开发。当我重构前端代码时，我希望能够快速直观地检查我网站上的所有实例。

我目前的计划是在一系列 iframe 中加载它们，并能够在每个 iframe 上快速浏览实例。在与朋友讨论后，我们提出的计划是使用 js 脚本来 1) 授予 iframe/CORS 对页面的访问权限，以及 2) 扫描页面并将类的实例发送给父级（具有框架）。我希望该站点单独运行，以便它可以是一个独立的项目。 （所以我在 localhost:4000 上运行“CSS Friend”，而我在 localhost:3000 上重构的站点。

最好使用 js 脚本，这样无论您的框架如何，您都可以将此脚本添加到您的 application.html 文件中，然后它就可以工作了。

我可以通过更改我的 development.rb 文件中的配置设置（如在服务器端）让 CORS 访问 iframe，但是当我运行时：

<script>
      console.log("script working");

      var method = "POST";
      var url = "http://localhost:4000";

      var xhr = new XMLHttpRequest();

      xhr.open(method, url);

      xhr.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
      xhr.setRequestHeader("Access-Control-Allow-Origin", "*");

      var text = {"command":"PUSH"};
      xhr.send(text);
</script>

（来自这个答案的一个想法：javascript set header Access-Control-Allow-Origin）

我收到以下错误：

Access to XMLHttpRequest at 'http://localhost:4000/post' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

是否可以使用 JS 脚本更改 CORS 设置，还是必须始终在服务器端进行？

Answer 1

您不能使用 javascript 更改 CORS 政策，因为 CORS 政策的存在是为了确保任何随机网站都不会做任何它想做的恶意事情。如果您可以使用 javascript 将其关闭，这一切都将毫无用处。

它的存在是为了保护您免受 javascript 的侵害，因此很明显 javascript 无法将其关闭。这有点像将密码写在电脑旁边的便条上。有点无意义。

但是，您可以做什么（在服务器端），将“Access-Control-Allow-Origin: *”标头附加到来自 localhost:4000 的 http 响应。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin