如果 PUT 同时具有凭据“包含”和内容类型，则会出现 CORS 错误 提示

如何解决如果 PUT 同时具有凭据“包含”和内容类型，则会出现 CORS 错误 提示

我正在使用 JavaScript fetch() 和以下选项：

window.fetch(path,{
    method: 'PUT',headers: {'Content-Type': 'application/json'},mode: 'cors',credentials: 'include',redirect: 'follow',referrerPolicy: 'no-referrer',cache: 'no-cache',body: JSON.stringify(data)
})

但我收到错误：

Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

我的 Access-Control-Allow-Headers 有通配符 *。

无需凭据即可工作

如果我不添加 credentials: include 并关闭 API 服务器上的身份验证，它可以正常工作。

无需 Content-Type 即可工作

如果我不添加 headers: {'Content-Type': 'application/json'}, 并在 API 服务器上保持身份验证开启，它会正常工作。这意味着它是用 text/plain;UTF-8 发送的，但内容仍然是 JSON。

---

标题

来自我的 API 服务器的标头：

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: *
Access-Control-Allow-Origin: http://localhost:3000
Access-Control-Expose-Headers: *

http://localhost:3000 是我的前端应用运行的地方。

---

提示

• 如果我收到此错误，Chrome 中的 devTools 无法向我显示响应标头（Access-Control-Allow-Headers 等）并且请求标头显示 Provisional headers are shown，其中仅包含 content-type: application/json 和在General 中没有method: PUT（根本没有方法）。所以看起来 Chrome 在触发之前停止了它。
• 服务器位于不同的域（实习网站）上，并在 http 上运行，SameSite: None 没有 Secure，但我在 Chrome 中禁用了安全性 Cookies without SameSite must be secure 以便在开发中绕过它模式。

credentials、content-type 和 PUT 之间有什么关系吗？是否可以使用 PUT 和 credentials 发送 application/json？如果不可能 - 我应该如何使用 PUT 方法发送数据？ FormData 不支持 cors 允许的内容类型。

解决方法

见MDN documentation for Access-Control-Allow-Headers：

值 * 仅作为没有凭据的请求（没有 HTTP cookie 或 HTTP 身份验证信息的请求）的特殊通配符值。在带有凭据的请求中，它被视为没有特殊语义的文字标头名称 *。请注意，Authorization 标头不能使用通配符，并且始终需要明确列出。

您需要明确指定要允许的标头。

,

将 Access-Control-Allow-Headers 从通配符 * 更改为显式 Content-Type 对我有用。