无法捕获组件中的http错误-Java 学习之路

我有Angular 5，HTTP拦截器和errorHandler的问题 .

我发送了一个http请求 . 响应可以是200或404（如果数据不存在） . 200与订阅组件完美配合 . 404是不同的，因为我从角度使用HttpInterceptor . 如果有错误，“catch error”函数会发回Observable错误但我无法从我的服务或我的组件中捕获此错误，我不知道为什么 .

test.component.ts

this.testService.findByProducId(product.id).subscribe(data => {

                console.log(data); 

                // processing
            },
            err => {
                console.log(err); // nothing here :(

            });

test.service.ts

findByProductId(productId){
        let url = this.getUrl() + "/product/" + productId;

        // headers
        let headers = this.setHttpHeaders();

    return this.http.get(url, {headers: headers})
        .map(res => res).share();
    }

httpListener (interceptor)

@Injectable()
export class HttpListener implements HttpInterceptor {

    countRequest: number = 0;
    countResponse: number = 0;
    logEnable: boolean = environment.logEnable;
    logUrl: string = environment.logUrl;

    constructor(
        @Inject( LoaderService ) public loaderService: LoaderService,
        @Inject( Router ) public router: Router) {
    }

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

        this.loaderService.show();
        this.countRequest++;

        return next.handle(req).pipe(
            map(event => {
                if (event instanceof HttpResponse) {
                    if (this.logEnable) {
                        // log data
                    }
                } 

                return event;
            }),
            catchError(error => {
                if (this.logEnable) {
                    // log data
                }

                switch(error.status) {
                    case 400: {
                        break;
                    }

                    // not authorized
                    case 401: {
                        this.router.navigate(["/"]);
                        break;
                    }
                    case 404: {
                        // my specific 404 case
                        if (!this.router.url.includes("/test/create")) {

                        }
                        else {

                            // I want to return the error to my service.
                        }
                    }
                }

                return Observable.throw(error);
            }),
            finalize(() => {

                this.countResponse++;

                if (this.countRequest == this.countResponse) {
                    this.loaderService.hide();

                    this.countRequest = 0;
                    this.countResponse = 0;
                }
            })
        )
    }
}

非常感谢你！

2 回答

试试这个，它对我有用

component.ts

this.testService.findByProducId(product.id).subscribe(

    data => console.log('success', data),
    error => console.log('oops', error));

service.ts

return this.http.get(url, {headers: headers}) 
            .map((response: Response) =>response.json())

回复于 2024-05-02T12:06:14+08:00

我终于找到了问题 . 我的拦截器中的函数“catchError”似乎停止了这个过程 . 这里是好的代码（也许我可以使用“catch”函数，但我有一个错误）：

error => {
                if (this.logEnable) {
                    // log data
                }

                switch(error.status) {
                    case 400: {
                        break;
                    }

                    // not authorized
                    case 401: {
                        this.router.navigate(["/"]);
                        break;
                    }
                    case 404: {
                        // my specific 404 case
                        if (!this.router.url.includes("/test/create")) {

                        }
                        else {

                            // I want to return the error to my service.
                            Observable.of(error);
                        }
                    }
                }

                return Observable.throw(error);
            }),

回复于 2024-05-02T12:06:14+08:00

无法捕获组件中的http错误

2 回答

相关问题