Question

我可以在登录后获取令牌的值，因为我从函数中传入用户名和密码的值。在下一页，我没有传递这些值。关于为什么我得到null是有道理的。那么获得该值的最有效方法是将页面之间的用户名和密码传递给页面并调用该函数吗？

Auth.ts

login(userName: string, password: string, route: string = null): any {
    this.logout(false);

    this.doLogin(userName, password)
      .subscribe(response => {
        let token:string = JSON.stringify(response.access_token);
        this.storage.set('token', token);
        console.log(token, 'this is the token here')

      });
  }

getToken(){
  this.storage.get('token').then((val) => {
        this.accessToken = val;
         })


         if(this.accessToken == undefined || this.accessToken == null){
              return '0'
         }
            else{
                return "Bearer " + this.accessToken.replace(/["]+/g, '')
            }
}

component.ts

login(){
this.authService.login(this.account.username, this.account.password)
}

Interceptor.ts

 intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {


        let access = this.auth.getToken()

        const authReq = req.clone({
                setHeaders: {
                Authorization: access
                }
        });

    return next.handle(authReq)
  }

谢谢！

Answer 1

您的代码异步。

this.storage.get('token').then((val) => {
  this.accessToken = val;
})

if(this.accessToken == undefined || this.accessToken == null){
  return '0'
} else {
  return "Bearer " + this.accessToken.replace(/["]+/g, '')
}

在这里，首先发生的事情是，一旦获得令牌（第一个块），您就注册了想要发生的事情。

然后，执行下面的if/else语句。 this.accessToken始终未定义。

一旦获取了令牌，就会运行then回调中的代码，仅在此之后设置accessToken。

如果你在这里和那里放几个console.logs，你可以确认这个behvaior。

你需要将代码依赖于在promise回调中异步获取的标记，就像这样。

this.storage.get('token').then((val) => {
  this.accessToken = val;

  if(this.accessToken == undefined || this.accessToken == null){
    return '0'
  } else {
    return "Bearer " + this.accessToken.replace(/["]+/g, '')
  }
})

作为旁注，this.accessToken == undefined和this.accessToken == null是等效的。只写其中一个就足够了;人们通常只会写this.accessToken == null以保持简短。

令牌返回的值为Null，而不是获取令牌的值。 Angular 4.3 Ionic 2 +

1 个答案: