Angular 如何跨角度组件保留JWT标记

我有一个运行JWT进行授权的DRF后端，在我的angular前端有一个UserService，负责获取令牌、验证和刷新。我的问题是如何有效地跨其他组件保存令牌

在我的应用程序组件中，我想使用JWT令牌调用API，但不知道如何保留从登录组件生成的令牌

public login(user) {
    this.http.post('http://localhost:8000/api-token-auth/', JSON.stringify(user), this.httpOptions).subscribe(
      data => {
        this.updateData(data['token']);
          console.warn(data['token']);
      },
      err => {
        this.errors = err['error'];
      }
    );
  }

你可以：

在您的服务上创建

令牌

属性

将获得的令牌存储在此属性上

创建一个

getToken（）

方法从外部检索它

代码：

然后，您可以在要使用令牌的组件上注入

UserService

，并调用

getToken（）

来检索它

---

此外，如果您在应用程序中执行多个需要此令牌的请求，更好的方法是使用一个将其包含在请求中（您可以使用上面提到的相同方法，在拦截器内调用

getToken（）

）。

最简单的方法是将其保存在一个或浏览器的对象中。我会选择第二种方法，因为本地存储现在更流行了。@Unsikable是对的！还要查看HttpInterceptor，以便在调用时附加JWT令牌

token = '';

public login(user) {
  this.http.post('http://localhost:8000/api-token-auth/', JSON.stringify(user), this.httpOptions).subscribe(
    data => {
      this.updateData(data['token']);
        console.warn(data['token']);
        this.token = data['token'];
    },
    err => {
      this.errors = err['error'];
    }
  );
}

getToken() {
  return this.token;
}