如何从角度 6 中的“响应标头”获取 JWT 令牌

Posted 2023-03-08

【中文标题】如何从角度 6 中的“响应标头”获取 JWT 令牌

【英文标题】：How to get JWT token from "Response Header" in angular 6

【发布时间】：2019-12-25 15:01:36

【问题描述】：

我正在开发一个 Angular 6 应用程序。输入登录凭据后，后端验证用户凭据并向我发送带有标头的 JWT 令牌。就像下面提到的细节。在从登录页面重定向到仪表板之前，如何在 Angular 应用程序中获取 JWT 令牌？

响应头

Access-Control-Allow-Credentials: true

Access-Control-Allow-Headers: Content-Type

Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS

Access-Control-Allow-Origin: *

Cache-Control: private

Content-Length: 138

Content-Type: text/html; charset=utf-8

Date: Tue, 20 Aug 2019 11:29:02 GMT

jwt: eyJhbGciOiJIUz...

位置：http://localhost:4200

我尝试与 HttpHeader 一起使用，但只获得空值。

let header = new HttpHeaders();
console.log('read header jwt token', header.get('jwt'));
const token = header.get('jwt');
localStorage.setItem('token', token);

【问题讨论】：

hm，提供更多信息或创建最小的演示，以便我们检查。

通常令牌作为响应的正文发送。你确定它在你的案例的标题中吗？

问题中的代码也没有意义。您正在创建一个新的 HttpHeaders 对象并希望从那里获取 jwt，但肯定不会存在

@igor_c。是的，我收到了来自标头的回复

【参考方案1】：

我在 API 调用期间遇到了同样的问题，下面的代码对我有用。

http.get<any>('http://localhost:4200')
      .subscribe(resp => 
       console.log('token', header.get('jwt'));
       const token = header.get('jwt');
       localStorage.setItem('token', token);
      );

【讨论】：

http.get 这是 HttpClient 还是 HttpHeaders？

@imjayabal http 请求总是使用 HttpClient

那会怎样，你没有在任何地方定义header。

@imjayabal 我没有发送任何代码。如果您真的在标头中获取令牌，请尝试以下操作：this.http.get(url, observe: 'response').subscribe(resp => console.log(resp.headers))