Question

我有一个运行JWT的DRF后端以进行授权，我在我的前端有一个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'];
      }
    );
  }

Answer 1

您可以：

在您的服务上创建token属性
将获得的令牌存储在此属性上
创建一个getToken()方法以从外部检索它

代码：

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

然后，您可以在要使用令牌的组件上注入UserService，并调用getToken()来检索令牌。

另外，如果您在整个应用程序中需要此令牌的几个请求，一个更好的主意是使用http interceptor将其包括在请求中（您可以使用上述相同的方法，调用{ {1}}在拦截器内。

如何在Angular组件之间保留JWT令牌

1 个答案: