授权标头中与 JWT 不记名令牌的 Angular 深度链接

Question

如何在 Angular 身份验证防护中获取传入请求标头？

在 Angular 17 应用程序中，我希望支持传入请求标头中带有 JWT 令牌的经过身份验证的深度链接，即启动 Angular 应用程序的请求。深层链接指向受保护的路由，因此会触发身份验证防护，但我找不到方法来访问启动应用程序的 HTTP 请求。

例如，在“小部件”Angular 应用程序中，受保护的路由可能如下所示：

https://example.org/widgets/1234

因为它是受保护的路由，所以小部件 Angular 应用程序会重定向到登录页面。但小部件应用程序不应重定向到登录，而是应使用传入请求的 JWT 授权令牌来为请求提供服务：

GET /widgets/1234 HTTP/1.1
Host: example.org
Authorization: <JWT TOKEN>

选择此 URL 后，Angular 应用程序将启动，并最终将

/widgets/1234

受保护的路由交给身份验证守卫。但认证守卫只能访问路由信息；我找不到获取授权标头以避免重定向到登录的方法。

有什么想法吗？

注意：我可以将 JWT 令牌添加为 URL 参数，因为身份验证防护确实可以访问该令牌，但我宁愿使用标头而不是 URL 参数来使令牌不可见。

注意：这是关于到 Angular 应用程序的传入请求，而不是来自 Angular 应用程序的传出请求。

Answer 1

从您的问题来看，文档中有一节拦截响应事件可以帮助我们拦截传入的响应。

export function loggingInterceptor(req: HttpRequest<unknown>, next: HttpHandlerFn): Observable<HttpEvent<unknown>> {
  return next(req).pipe(tap(event => {
    if (event.type === HttpEventType.Response) {
      console.log(req.url, 'returned a response with status', event.status);
    }
  }));
}