在模式中使用提取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