Question

我正在使用带有angular2-jwt插件的Ionic 2最终版本。我成功记录并接收保存到存储的令牌

this.storage.set('id_token', res.token);

刷新页面后，我尝试在auth.ts标头中检查授权，从不发送令牌。我知道问题在于异步存储，但我不知道如何解决它。我尝试了很多不同的解决方案......

另外，当我在常量中保存令牌时，它的工作原理非常好。

我的app.module.ts看起来像这样：

...

export function getAuthHttp(http) {
  return new AuthHttp(new AuthConfig({
     noJwtError: true,
     globalHeaders: [{'Content-Type': 'application/json', 'x-academy': 'academy'}],
     tokenGetter: () => storage.get('id_token'),
  }), http);
}

...

providers: [
   {provide: ErrorHandler, useClass: IonicErrorHandler},
   {provide: AuthHttp, useFactory: getAuthHttp, deps: [Http]}
 ...
]

我的auth.ts：

...
@Injectable()
export class Auth {

    serverUrl: string;
    storage: Storage = new Storage();  

    constructor(public http: Http,
          public authHttp: AuthHttp,
          public constantsService: ConstantsService,
    ) {                 
       this.serverUrl = this.constantsService.API_ENDPOINT();

    }

    login(credentials){ 
      let headers = new Headers({'Content-Type': 'application/json', 'x-academy': 'academy' });
      return this.authHttp.post(this.serverUrl+'/login', JSON.stringify(credentials), {headers: headers})
    }
    ....
    public checkAuthentication(){
       return this.authHttp.post(this.serverUrl+'/restricted',{})
    }
    ....

谢谢。

Answer 1

将getAuthHttp更改为使用localStorage而不是离子存储：

export function getAuthHttp(http) {
  return new AuthHttp(new AuthConfig({
    globalHeaders: [{'Accept': 'application/json'}],
    //tokenGetter: (() => storage.get('id_token').then((val)=>{return val}) ),
    tokenGetter: (() => JSON.parse(window.localStorage.getItem("id_token"))),
    noJwtError: true,
    headerPrefix: "JWT",
  }), http);
}

据我所知，auth0 sdk并没有使用Ionic存储来存储id_token ...它只是使用了window.localStorage，所以你也可以只使用它而且它是同步的方法，以避免这种承诺的东西。

Ionic 2应用程序无法从存储中获取JWT令牌

1 个答案: