CORS 访问阻塞

Question

我可能需要一些帮助。

我试图与 XMLHttpRequest 建立连接，从 JavaScript 到另一个来源的 PHP 脚本。

我注意到的第一件事是我从这个请求中得到一个错误，它告诉我缺少 header。我搜索了一下，发现 this documentation。我这样修改了 header：

JS

//this.mozSystem = true;
this.open("POST", url, true);
this.setRequestHeader("Content-type", "application/json");
this.setRequestHeader("ADDON-TO-SERVER", "");
this.setRequestHeader("Content-length", massage.length);
this.setRequestHeader("Connection", "close");

PHP

header("Content-type: application/json");
header("Access-Control-Allow-Origin: *");
header("Access-Control-Request-Method: POST");
header("Access-Control-Allow-Headers: ADDON-TO-SERVER,Content-type");

它有效...但我不确定为什么

header("Access-Control-Allow-Headers: ADDON-TO-SERVER,Content-type");

需要

Content-type。

Mozilla 让我添加这个，但我认为它只需要一个自定义 header，而且 Content-type 不是基本的吗？

有人可以告诉我为什么需要这样做，并告诉我我是否按照预期的方式做了所有事情。

感谢您的帮助，费雷尔

Answer 1

就 CORS 上下文中的 header 而言，值为 application/json 的 Content-type 请求 header 不被视为“基本请求” （借用你的措辞）。

在 CORS 的上下文中，Content-type 请求 header 仅在其值为 application/x-www-form-urlencoded、multipart/form-data 或 [=15= 时才被视为“基本” ].

因此，只有当您向其发送该请求的服务器明确表示可以接收此类请求时，您的浏览器才会允许来自 Web 应用程序的 Content-type: application/json 请求按预期工作。服务器执行此操作的方式是使用包含 Content-type.

的 Access-Control-Allow-Headersheader 进行响应

你的浏览器强制执行该限制的理由是，除非服务器明确指示它可以接受某些类型的 cross-origin 请求，否则 CORS 不会允许 Web 应用程序执行任何类型的程序化 cross-origin 请求比基本 HTML form 元素操作一直能够做的更多 cross-origin.

因此，在 CORS 出现之前，HTML 页面一直仅限于发送 application/x-www-form-urlencoded、multipart/form-data 或 text/plain 请求 cross-origin ，这就是基本 CORS 行为的限制，除非服务器 opts-in 更多。

CORS 访问阻塞

CORS access blocking

javascript

php

http-headers

cors