使用带有模式的fetch 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(…

---

Popup在哪里询问我的用户名和密码

---

来自网络选项卡的请求和响应调用

Answer 1

您的标头都没有CORS-safelisted,因此它们无法附加到请求中.

说明:

1. no-cors请求模式将guard标头对象的属性设置为request-no-cors

2. 要将名称/值(名称/值)对附加到Headers对象(标题),浏览器必须运行以下步骤:

   1. 规范化价值.

   2. 如果name不是名称或值不是值,则抛出TypeError.

   3. 如果guard是"不可变的",则抛出TypeError.

   4. 否则,如果guard是"request"且name是禁止的头名,则返回.

   5. 否则,如果后卫"request-no-cors"和名称/值不是a 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在此处了解有关fetch 规范的更多信息:https: //fetch.spec.whatwg.org/#headers-class