如何解决localStorage同步异步的问题?

前端框架Angular 7+ionic4,在公众号中需要在app.compponents.ts文件中走授权接口,拿到授权后把token存在本地,然后跳转到其它页面在接口请求中把token放到请求头中,现在的问题是有时候token还没拿到就先走了其它接口了,导致数据无法请求到,我现在的做法是延迟加载500ms后再去请求接口以保证token已存在localstorage中,不知道是否有更好的办法。

阅读 9.1k
2 个回答

古老的方法的话,使用Promise,但Angular的http接口和其他异步处理接口都是使用Observable,Angular7/inonic4可以使用es7的async/await,这个更方便。

如果直接使用Observable,则可以这样保证取得tocken之后,再调用navigateToPageXXX跳转到XXX页面。

getLicense().subscribe(token=>{
    navigateToPageXXX(token);
});

如果是async/await,则定义

async getLicense():string{

    ...
    return await this.http.post().toPromise();
}

toPageXXX(){
    let token= await this.getLicense();
    navigateToPageXXX(token);
}

用全局变量 放,
然后同时存localstorage,
(上两步可以 封装一个方法)

取的时候,
从全局变量取,
没值 的时候取localstorage里的值。
(也可以封装一个方法)

然后再写一个清除的方法