Angular HttpClient授权标头已创建但消失了 [英] Angular HttpClient authorization header created but disappearing

查看:62
本文介绍了Angular HttpClient授权标头已创建但消失了的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问题

我正在尝试发送请求标头,特别是授权标头.授权标头应如下所示:授权:基本NTY2MTI0Og == 在标题列表中.其中 Basic 表示它是使用base64编码的.

我很肯定它确实被添加到了Angular中的get请求中:在Angular中的请求.尽管我不确定 op 是什么.(顺便说一句,我还不能嵌入图像)

它应该是这样的:来自标准Datasnap Delphi项目

这是我的样子:在此处输入图像描述

如您所见,缺少Authorization标头.

错误

控制台错误:屏幕截图

提琴手原始请求:屏幕截图

这是我创建Rest调用的方式:

  public authRestCall(auth:string):可观察< string>{var headers = new HttpHeaders;//HttpHeaders是不可变的headers = headers.append('Authorization','Basic'+ auth);返回this.http.get< string>(this.localUrl +'DSAdmin/GetPlatformName',{headers:headers});} 


替代

我尝试执行此操作的另一种方法是创建这样的对象,如 Angular guide中所述

  const httpOptions = {标头:新的HttpHeaders({'授权':'NTY2MTI0OnVuZGVmaW5lZA =='})}; 

然后我将这样添加:

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


Delphi

在后端服务器(一个Delphi datasnap模块)中,我已经这样配置了CORS:

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


版本

-角度5-离子角:3.9.2- 项目清单-德尔福RAD Studio 10.1柏林


没有为我解决的来源

Angular 4.3 HTTPClient基本授权不起作用

Angular HttpClient未设置授权标头

Angular 4.3 HttpClient不发送授权标头

在get请求中添加授权"标头

我检查了更多的问题,但是没有一个问题能帮助我解决问题.我已经坚持了将近一个星期.也许我无法正确理解某些内容,但是它无法正常工作.

如果不清楚,或者我应该添加更多信息,请告诉我.谢谢您的阅读.


屏幕托管为文本

角头对象:

 标头:Map(0){}lazyInit:HttpHeaders {normalizedNames:Map(0),lazyUpdate:null,标头:地图(0)}lazyUpdate:数组(1)0:名称:授权"op:"a"值:基本NTY2MTI0OnVuZGVmaW5lZA =="__proto__:对象长度:1__proto__:数组(0)normalizedNames:Map(0){}__proto__:对象 

它应该是什么样的

 请求URL:http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName/请求方法:GET状态码:200 OK远程地址:127.0.0.1:8888推荐人政策:降级时不推荐人访问控制允许标题:*访问控制允许方法:*访问控制允许来源:*连接方式:关闭内容长度:20内容类型:text/html;字符集= UTF-8日期:2018年10月18日,星期四10:09:38 GMT语法:dssession = 63572.937476.131783,dssessionexpires = 1197188接受:application/json接受编码:gzip,deflate,br接受语言:en-GB,en; q = 0.9,nl-NL; q = 0.8,nl; q = 0.7,en-US; q = 0.6授权:基本NTY2MTI0Og ==快取控制:max-age = 0内容类型:文本/纯文本;字符集= UTF-8主机:localhost:8080If-Modified-Since:1990年10月1日,星期一,05:00:00 GMT代理连接:保持活动状态引荐来源:http://localhost:8080/用户代理:Mozilla/5.0(Windows NT 10.0; Win64; x64)AppleWebKit/537.36(KHTML,如Gecko)Chrome/69.0.3497.100 Safari/537.36 

我的模样是什么

 请求URL:http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName请求方法:OPTIONS状态码:401未经授权远端地址:[:: 1]:8080推荐人政策:降级时不推荐人访问控制允许标题:*访问控制允许方法:*访问控制允许来源:*连接方式:关闭内容长度:49内容类型:text/html;字符集= utf-8日期:2018年10月18日星期四13:47:12 GMTWWW-Authenticate:基本领域="REST"接受: */*接受编码:gzip,deflate,br接受语言:en-GB,en; q = 0.9,nl-NL; q = 0.8,nl; q = 0.7,en-US; q = 0.6访问控制请求标头:授权访问控制请求方法:GET连接:保持活动状态主机:localhost:8080来源:http://localhost:8100用户代理:Mozilla/5.0(Windows NT 10.0; Win64; x64)AppleWebKit/537.36(KHTML,如Gecko)Chrome/69.0.3497.100 Safari/537.36 

控制台错误:

  VM1038:1选项http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName401(未经授权)(匿名)@ VM1038:1(索引):1加载失败http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName:的响应预检没有HTTP正常状态. 

Fiddler Raw:请求

 选项http://localhost:8080/datasnap/rest/DSAdmin/GetPlatformName HTTP/1.1主机:localhost:8080连接:保持活动状态访问控制请求方法:GET来源:http://localhost:8100用户代理:Mozilla/5.0(Windows NT 10.0; Win64; x64)AppleWebKit/537.36(KHTML,如Gecko)Chrome/69.0.3497.100 Safari/537.36访问控制请求标头:授权,x身份验证,x身份验证模拟接受: */*接受编码:gzip,deflate,br接受语言:en-GB,en; q = 0.9,nl-NL; q = 0.8,nl; q = 0.7,en-US; q = 0.6 

响应

  HTTP/1.1 401未经授权连接方式:关闭内容类型:text/html;字符集= utf-8内容长度:49日期:2018年10月18日,星期四10:06:24 GMT访问控制允许来源:*访问控制允许标题:*访问控制允许方法:*WWW-Authenticate:基本领域="REST"< HTML>< BODY>< B> 401未经授权</B>/BODY</HTML> 

解决方案

我通过将以下代码段添加到Delphi中的 TWebModule1.WebModuleBeforeDispatch 中来对其进行了修复:

  if Trim(Request.GetFieldByName('Access-Control-Request-Headers'))<>'' 然后开始Response.SetCustomHeader('Access-Control-Allow-Headers',Request.GetFieldByName('Access-Control-Request-Headers'));处理:= True;结尾; 

来源: Delphi的Datasnap ISAPI模块上的CORS问题

Problem

I am trying to send Request Headers, specifically, an authorization header. The authorization Header should look something like this: Authorization: Basic NTY2MTI0Og== In a list of headers. Where Basic indicates that it is encoded with base64.

I'm positive it does get added to the get request made in Angular: Request in Angular. Although I'm not sure what op is. (btw, I'm not yet allowed to embed the image)

This is what it should look like: From the standard Datasnap Delphi project

This is what mine look like: enter image description here

As you can see, the Authorization header is missing.

Errors

Console Error: Screenshot

Fiddler Raw request: Screenshot

This is how I create the Rest call:

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});
}


Alternative

another way I tried doing this was to create an object like this, described in the Angular guide

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

which I would then add like this:

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


Delphi

In the backend server (A Delphi datasnap module) I have configured CORS like this:

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


Versions

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


Sources that did not solve it for me

Angular 4.3 HTTPClient Basic Authorization not working

Angular HttpClient not setting Authorization header

Angular 4.3 HttpClient doesn't send Authorization header

Adding "Authorization" header in get request

I have checked many more questions, but none of them helped me solve the problem. I've been stuck on this for almost a week now. Maybe I'm not understanding something correctly, but it is not working.

If something is not clear or if I should add more info about something, please let me know. Thank you for reading.


Screenshosts as text

Angular headers object:

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

What it should look like:

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

What mine looks like:

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

Console error:

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: Request

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

Response

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>

解决方案

I fixed it by adding the following piece of code to the TWebModule1.WebModuleBeforeDispatch in Delphi:

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;

Source: CORS issue on a Delphi's Datasnap ISAPI Module

这篇关于Angular HttpClient授权标头已创建但消失了的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆