实际处理来自服务器的 Angular HTTP 404 错误,它表示没有记录的有效响应

Handling Angular HTTP 404 error from server actually which represents a valid response with no records

我遇到的情况是,我使用的 Web 服务编码不一致,我无法更改它们的行为。我的主要问题是,在后端数据库中没有与查询条件对应的记录的情况下,Web 服务 return 在有效 GET 方法上出现 HTTP 404 错误。正确的行为应该是 200 带有空元素数组(例如公司列表)的 HTTP 响应。

我有一个 Angular interceptor 和一个 catchError 函数,我已经编码以识别 404 确实不是错误的情况。在这个逻辑中,我想抑制错误和 return 包含 body: {companies: []}.

response

有办法吗?

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
    public intercept(request: { clone: (arg0: { headers: any; }) => any; headers: { set: (arg0: string, arg1: string) => any; }; }, next: { handle: (arg0: any) => any; }) {

...

        return next.handle(request.clone({headers})).pipe(
            // retry(1),
            catchError((error: HttpErrorResponse) => {
                let message;

                if (error.error instanceof ErrorEvent) {
                    message = `Client error: ${error.error.message}`;
                }
                else {
                    message = `Server code: ${error.status}\nMessage: ${error.message}`;

                    // detect 404 error that aren't really errors

                    if (404 === error.status && [Webservices.GET_MEMBER_COMPANIES, Webservices.GET_MEMBER_PERSONS, Webservices.GET_MEMBER_PERSON_COMPANY_LINKS, Webservices.GET_MEMBER_VISUALIZATION_STATES].some((path: string) => {
                        return (new RegExp(path.replace(Webservices.MEMBER_ID, '\d+').replace(Webservices.COMPANY_ID, '\d+').replace(Webservices.PERSON_ID, '\d+').replace(Webservices.VISUALIZATION_STATE_ID, '\d+'))).test(error.url);
                    })) {
                        console.debug(error);
                    }
                }

                console.debug(headers);
                console.debug(message);

                // window.alert(message);

                return throwError(message);
            })
        );
    }
}

注意:以上是正在进行的工作,仅用于说明错误处理程序的状态

谢谢!

在您的 catchError 中,您需要 return 一个 Observable<HttpResponse>。试试这个:

import {of} from 'rxjs'; //Add this

catchError((error: HttpErrorResponse) => {
    if (404 === error.status){
        var response = new HttpResponse({
             body: {companies: []} //your body object
        });
        return of(response);
    }
    return throwError(message);
}

说明:如果您查看拦截器签名 (HttpEvent) intercept(req:HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>,return 类型是 Observable<HttpEvent<any>>,这是一个 Angular 类型,定义为:

type HttpEvent<T> = HttpSentEvent | HttpHeaderResponse | HttpResponse<T> | HttpProgressEvent | HttpUserEvent<T>;

因此构建您的 HttpResponse 变量并使用运算符将​​其 return 作为 Observable。

就这些了。