Angular HttpClient授權標頭已創建但正在消失

Question

問題

我正在嘗試發送請求標頭，特別是授權標頭。 授權標題應如下所示： Authorization: Basic NTY2MTI0Og==在標題列表中。 Basic表示它使用base64編碼。

我很肯定它會被添加到Angular中的get請求中：Angular中的Request。 雖然我不確定op是什么。 （順便說一句，我還沒有被允許嵌入圖像）

這應該是它的樣子： 來自標准的Datasnap Delphi項目

這就是我的樣子： 在這里輸入圖像描述

如您所見，缺少Authorization標頭。

錯誤

控制台錯誤： 屏幕截圖

Fiddler Raw請求： 截圖

這就是我創建Rest調用的方式：

public authRestCall(auth: string): Observable<string> {
  var headers = new HttpHeaders;
  //HttpHeaders is immutable
  headers = headers.append('Authorization', 'Basic ' + auth);
  return this.http.get<string>(this.localUrl + 'DSAdmin/GetPlatformName', {headers: headers});
}

---

替代

我嘗試這樣做的另一種方法是創建一個像Angular指南中描述的這樣的對象

const httpOptions = {
  headers: new HttpHeaders({
  'Authorization': 'NTY2MTI0OnVuZGVmaW5lZA=='
  })
};

然后我會添加如下：

return this.http.get<string>(this.localUrl + 'DSAdmin/GetPlatformName', httpOptions;

---

德爾福

在后端服務器（A Delphi datasnap模塊）中，我已經像這樣配置了CORS：

Response.setCustomHeader('Access-Control-Allow-Origin','*');
Response.SetCustomHeader('Access-Control-Allow-Headers','*');
Response.SetCustomHeader('Access-Control-Allow-Methods','*');

---

版本

- Angular 5 - ionic-angular: 3.9.2 - List item - Delphi RAD studio 10.1 Berlin

---

沒有為我解決的消息來源

Angular 4.3 HTTPClient基本授權不起作用

Angular HttpClient未設置Authorization標頭

Angular 4.3 HttpClient不發送Authorization標頭

在get請求中添加“Authorization”標頭

我已經檢查了更多問題，但沒有一個能幫我解決問題。 我已經堅持了近一個星期了。 也許我沒有正確理解某些東西，但它無法正常工作。

如果有什么不清楚或者我應該添加更多關於某事的信息，請告訴我。 謝謝你的閱讀。

---

Screenshosts as text

角度頭對象：

headers: Map(0) {}
lazyInit: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, headers: 
Map(0)}
lazyUpdate: Array(1)
  0:
    name: "Authorization"
    op: "a"
    value: "Basic NTY2MTI0OnVuZGVmaW5lZA=="
    __proto__: Object
    length: 1
  __proto__: Array(0)
normalizedNames: Map(0) {}
__proto__: Object

應該是什么樣的：

Request URL: http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName/
Request Method: GET
Status Code: 200 OK
Remote Address: 127.0.0.1:8888
Referrer Policy: no-referrer-when-downgrade
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Connection: close
Content-Length: 20
Content-Type: text/html; charset=UTF-8
Date: Thu, 18 Oct 2018 10:09:38 GMT
Pragma: dssession=63572.937476.131783,dssessionexpires=1197188
Accept: application/json
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,nl-NL;q=0.8,nl;q=0.7,en-US;q=0.6
Authorization: Basic NTY2MTI0Og==
Cache-Control: max-age=0
Content-Type: text/plain;charset=UTF-8
Host: localhost:8080
If-Modified-Since: Mon, 1 Oct 1990 05:00:00 GMT
Proxy-Connection: keep-alive
Referer: http://localhost:8080/
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36

我的樣子：

Request URL: http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName
Request Method: OPTIONS
Status Code: 401 Unauthorized
Remote Address: [::1]:8080
Referrer Policy: no-referrer-when-downgrade
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Connection: close
Content-Length: 49
Content-Type: text/html; charset=utf-8
Date: Thu, 18 Oct 2018 13:47:12 GMT
WWW-Authenticate: Basic realm="REST"
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,nl-NL;q=0.8,nl;q=0.7,en-US;q=0.6
Access-Control-Request-Headers: authorization
Access-Control-Request-Method: GET
Connection: keep-alive
Host: localhost:8080
Origin: http://localhost:8100
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36

控制台錯誤：

VM1038:1 OPTIONS http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName 
401 (Unauthorized)
(anonymous) @ VM1038:1

(index):1 Failed to load 
http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName: Response for 
preflight does not have HTTP ok status.

Fiddler Raw：請求

OPTIONS http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://localhost:8100
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36
Access-Control-Request-Headers: authorization,x-authentication,x-authentication-impersonate
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,nl-NL;q=0.8,nl;q=0.7,en-US;q=0.6

響應

HTTP/1.1 401 Unauthorized
Connection: close
Content-Type: text/html; charset=utf-8
Content-Length: 49
Date: Thu, 18 Oct 2018 10:06:24 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
WWW-Authenticate: Basic realm="REST"
<HTML><BODY><B>401 Unauthorized</B></BODY></HTML>

Answer 1

我通過將以下代碼添加到Delphi中的TWebModule1.WebModuleBeforeDispatch來修復它：

if Trim(Request.GetFieldByName('Access-Control-Request-Headers')) <> '' then
begin
  Response.SetCustomHeader('Access-Control-Allow-Headers', Request.GetFieldByName('Access-Control-Request-Headers'));
  Handled := True;
end;

來源： Delphi的Datasnap ISAPI模塊上的CORS問題