拦截 http 并添加标头 - IONIC答案

【问题标题】：Intercept http and add headers - IONIC拦截 http 并添加标头 - IONIC
【发布时间】：2020-08-28 23:46:10
【问题描述】：

我正在运行一个 Ionic 4 应用程序，其中包含一个 http 拦截器以在请求之间添加一些负载。

我还有一个凭证服务，用于验证我的存储中是否有令牌。

这是我的拦截器

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        this.requests.push(req);
        this.loaderService.isLoading.next(true);
        return new Observable(observer => {
            const subscription = next.handle(req)
                .subscribe(
                    event => {
                        if (event instanceof HttpResponse) {
                            this.removeRequest(req);
                            observer.next(event);
                        }
                    },
                    (err: Error ) => {
                        this.alertservice.info(err.message, 'id1');
                        this.removeRequest(req);
                        observer.error(err);
                    },
                    () => {
                        this.removeRequest(req);
                        observer.complete();
                    });
            // remove request from queue when cancelled
            return () => {
                this.removeRequest(req);
                subscription.unsubscribe();
            };
        });
    }

它可以工作，但是当我尝试添加以下行时，它停止工作并重定向到我的错误页面并且没有任何控制台，我无法跟踪它。

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        //console.log(this.credentialService.credentials.token);
        // console.log(authToken);

谁能帮我理解为什么会这样，以及如何解决？

【问题讨论】：

让我们知道您的 credentialService 的代码

标签： ionic4 angular-http-interceptors

【解决方案1】：

我只是想通了，感觉很愚蠢，

this.credentialService.credentials 为空，因为在登录之前没有，所以拦截器将我发送到错误部分，要修复，我首先验证它是否不为空，然后正确添加标题：

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        let clonedReq: any;
        if (this.credentialService.credentials !== null) {
            const authToken = this.credentialService.credentials.token;
            clonedReq = req.clone({headers: req.headers.set('Authorization', authToken)});
        } else {
            clonedReq = req.clone({headers: req.headers.delete('Authorization')});
        }
    {...}

【讨论】：