来自CORS预检通道的CORS标头“ Access-Control-Allow-Headers”中缺少令牌_JavaScript

后端退货

Access-Control-Allow-Headers: *

我有一个要求

fetch('url-here', {
    // ...
    headers: {
        'X-Auth': token,
    }
})

它可以在Chrome浏览器中运行，但对于Firefox，我可以

跨域请求被阻止：同源策略禁止在<... cut ...>处读取远程资源。 （原因：CORS预检通道的CORS标头“ Access-Control-Allow-Headers”中缺少令牌“ X-Auth”）。[了解更多]跨域请求被阻止：同源策略禁止读取<处的远程资源。 ..cut ...>。 （原因：CORS请求未成功）

问题是，一些浏览器还没有让*通配符Access-Control-Allow-Headers 。 值得注意的是，Firefox 69和更早版本没有。 参见。

因此，为确保您在所有浏览器中都能达到预期的行为，您发送回的Access-Control-Allow-Headers值应显式列出您实际上需要从前端代码访问的所有标头名称。 例如，对于问题中的情况： Access-Control-Allow-Headers: X-Auth 。

无需对所有标头名称进行硬编码就可以实现此目的的一种方法是：让服务器端代码采用浏览器发送的Access-Control-Request-Headers请求标头的值，然后将其回显到服务器发送回的Access-Control-Allow-Headers响应标头。

否则，请使用一些现有的库来启用您的服务器的CORS。 大多数CORS库通常会为您提供将Access-Control-Request-Headers请求标头值添加到Access-Control-Allow-Headers响应标头值中的功能。

来自CORS预检通道的CORS标头“ Access-Control-Allow-Headers”中缺少令牌

问题描述

1楼