Angular4：使用HttpClient的拦截器来设置微调器

发布时间：2020-12-17 17:29:20 所属栏目：安全来源：网络整理

导读：这里我写的拦截器是通过拦截器直接处理微调器的 @Injectable()export class ApiInterceptor implements HttpInterceptor { constructor(private _globalSpinnerService: GlobalSpinnerService) {} intercept(req: HttpRequestany,next: HttpHandler): Observ

这里我写的拦截器是通过拦截器直接处理微调器的

@Injectable()
export class ApiInterceptor implements HttpInterceptor {
    constructor(private _globalSpinnerService: GlobalSpinnerService) {}

    intercept(req: HttpRequest<any>,next: HttpHandler): Observable<HttpEvent<any>> {
        const spinnerParam: string = req.params.get("spinner")
        let handleObs: Observable<HttpEvent<any>> = next.handle(req)
        if(spinnerParam) {
            this._globalSpinnerService.spinner = true
            handleObs.toPromise().then(() => {
                this._globalSpinnerService.spinner = false
            })
        }

        return handleObs
    }
}

它按预期工作.但是,我现在看到所有涉及微调器的请求都被发送了两次.所以我想我删除微调器的方法并不是最好的.一旦手柄结束,我如何告诉我的拦截器移除我的微调器？

编辑：

我通过替换handleObs.toPromise()然后通过handleObs.do()更改了代码,现在它正常工作.我不知道为什么

解决方法

发生这种情况是因为handleObs observable很冷,toPromise创建订阅,然后httpClient(…).subscribe创建另一个订阅.这导致了几个请求.是的,应该使用handleObs.do(),它不会导致订阅,只是提供副作用.

通常需要为微调器提供请求计数器,因为它应该正确处理并发请求：

function spinnerCallback() {
  if (globalSpinnerService.requestCount > 0) 
    globalSpinnerService.requestCount--;
}

if(spinnerParam) {
    globalSpinnerService.requestCount++;
    handleObs.do(spinnerCallback,spinnerCallback);
}

而globalSpinnerService.spinner实际上是一个getter：

get spinner() {
  this.requestCount > 0;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!