Question

我想缓存（使用会话存储）我用RXJS订阅的HTTP响应。如果同一个请求（URL）再次调用，我想使用会话存储而不是从服务器接收它。

我将URL保存为会话存储和服务器响应的密钥作为值。

我是Angular 2，RXJS和Observer概念的初学者想知道这种方法的可扩展性。

private setLoginData():void{
    this.loginDataObserver().subscribe(
        (data:any)=>{
            let loginData:LoginUser={
                id : data.employee.id,
                name : data.employee.first_name+' '+data.employee.last_name,
                jobTitle : data.employee.job_title,
                company : data.profile.name,
                avatar : data.employee.avatar,
                role : data.role
            }

        }
    );
}

private loginDataObserver(){
    let options = new RequestOptions({headers: new Headers({'Content-Type': 'application/json'})});
    let params: URLSearchParams = new URLSearchParams();
    params.set('token',this.cookie.get('token'));
    options.search=params;

    if(sessionStorage.getItem(this.dataUrl+this.cookie.get('userId'))!=null){
        let cacheJson=JSON.parse(sessionStorage.getItem(this.dataUrl+this.cookie.get('userId')));
        let cacheDataProvider : BehaviorSubject<any> = new BehaviorSubject<any>(cacheJson);
        let cacheObserver:Observable<any>=cacheDataProvider.asObservable();
        return cacheObserver;
    }

    return this.http.get(this.dataUrl,options).
            do((res:Response) => sessionStorage.setItem(this.dataUrl,JSON.stringify(res.json()))).
            map((res:Response) => res.json()).
            catch(this.handleError)
}

我计划使用启用缓存的方法

将其作为Angular 2服务进行增强

Answer 1

我会做三种方法：

getUrlContentsFromCache(url) : Observable<string>
getUrlContentsFromWeb(url) : Observable<string>
storeInCache(url, contents) : Observable<string>

由于默认情况下Rx是惰性的，您可以使用.concat结合.take(1)来阻止从缓存中成功检索，也可以从网上获取内容：

function getContents(url){
  return getUrlContentsFromCache(url)
    .concat(
      getUrlContentsFromWeb(url)
        .flatMap(content => storeInCache(url, content))
    )
    .take(1);
}

Angular 2缓存对会话存储的HTTP响应

1 个答案: