在模式中使用提取API：'no-cors'，无法设置请求标头

Question

我正在尝试访问服务端点并且该服务是登录服务 我使用的是基本身份验证类型，代码是在反应和使用获取库，但即使我在我的请求中设置标题字段我无法看到在我的要求在网络选项卡中的相应标题的值？

以下是代码：

var obj = { 
    method: 'GET' , 
    mode : 'no-cors', 
    headers: { 
     'Access-Control-Request-Headers': 'Authorization', 
     'Authorization': 'Basic amFzcGVyYWRtaW46amFzcGVyYWRtaW4=', 
     'Content-Type': 'application/json', 
     'Origin': '' 
    }, 
    credentials: 'include' 
}; 
fetch('http://myreport:8082/jasperserver/rest/login/', obj).then(… 

---

弹出其中的问我的用户名和密码

---

请求和响应来自网络标签调用

Answer 1

您的标题都不是CORS-safelisted，因此它们不能附加到请求。

说明：

1. no-cors请求模式设置guard属性为一个标题对象来request-no-cors

2. 要附加一个名称/值（名称/值）对到一个集管对象（头），浏览器具有运行这些步骤：

   1. 标准化值。

   2. 如果名称不是名称或值不是一个值，则抛出一个TypeError。

   3. 如果guard是“不可变的”，则抛出一个TypeError。

   4. 否则，如果警卫是“请求”并且名称是禁止标题名称，则返回。

   5. 否则，如果警卫是"request-no-cors"并且名称/值不是CORS-safelisted request-header，则返回。 ←你的场景

   6. 否则，如果guard是“response”并且name是禁止响应头名称，则返回。

   7. 将名称/值附加到标题列表。

3. CORS-safelisted request-header（不区分大小写）：
   • Accept
   • Accept-Language
   • Content-Language
   • Content-Type，但仅当该值之一：
     • application/x-www-form-urlencoded
     • multipart/form-data
     • text/plain

您可以了解更多关于获取的Headers class规格在这里： https://fetch.spec.whatwg.org/#headers-class