Angular 如何从 authguard 中检索？

Posted 2023-03-10

【中文标题】Angular 如何从 authguard 中检索？

【英文标题】：Angular how can I retrieve from authguard?

【发布时间】：2020-03-02 03:56:08

【问题描述】：

我有一个带有 jwt 身份验证的 Angular-springboot 程序，我想知道如何在 Angular 上登录后，恢复登录者的数据，例如用户名。我查看了一些关于 authguard 和 httpinterceptors 的指南，但我对 rigurado 有点困惑，你们中的任何人都可以给我发一个它检索数据的代码吗？我从指南中复制了一些服务，这些服务是 auth-guard、身份验证、basic-auth-http-interceptors 和 httpclient，我认为这些服务非常标准，但如果需要，我会发布它们

【问题讨论】：

您好，首先，您列出的某些服务并未真正用于检索/获取数据。例如： - Authguard：如果您指的是 RouteGuard，这些用于允许/阻止用户访问特定路由，这通常基于身份验证 (angular.io/guide/router#milestone-5-route-guards) - HttpInterceptors：这些用于执行任何针对您想要定位的任何 API 请求的附加逻辑 (angular.io/api/common/http/HttpInterceptor) 一旦经过身份验证的用户登录，您将如何处理他们的详细信息？ （比如他们的 id）

TYPO 警报 - 它是 警卫 - 不是“守卫” ....

【参考方案1】：

当用户登录系统时，将令牌类型和jwt令牌保存在本地存储中。在 TokenInterceptor 的帮助下，它会在每个请求中发送标头详细信息。

import  Injectable  from '@angular/core';
import 
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor, HttpResponse
 from '@angular/common/http';
import  Observable  from 'rxjs';
@Injectable()
export class TokenInterceptor implements HttpInterceptor 
  constructor()  
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> 
    request = request.clone(
      setHeaders: 
        Authorization: `$localStorage.getItem('token_type') $localStorage.getItem('jwt_token')`
      
    );
    return next.handle(request);
  

在 app.module.ts 中添加提供者 provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true

【参考方案2】：

谢谢，是的，我有一个像这样的拦截器，它保存在本地存储中，但是如果我在另一个组件中，并且我想调用它，例如我按下一个按钮，并且在我想做的方法中，一个帖子，如果你按下这个按钮，你必须登录好吗？，你必须更新数据库，所以我需要知道谁按下了这个，如何找回这个？