Angular 5 - 响应 HttpInterceptor - 超时重试 (504)

Angular 5 - Response HttpInterceptor - retry on timeout (504)

我尝试实现一个 HttpInterceptor 来重试超时的请求。我实现了下面的代码,但是 err 不包含状态码,因此它不起作用。

@Injectable()
export class RetryInterceptor implements HttpInterceptor {

    constructor() { }

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        return next.handle(req)
            .retryWhen(error => {
                return error
                    .flatMap((err) => {

                        if (err instanceof HttpErrorResponse && err.status === 504) { // timeout

                            return Observable.of(err.status).delay(5000);
                        }

                        return Observable.throw({ error: 'No retry' });
                    })
                    .take(1)
                    .concat(Observable.throw({ error: 'Sorry, there was an error (after 5 retries)' }));

            });
    }
}

err object有如下object(注意状态为0):

Devtools 显示错误 504:

谁能帮帮我?

提前致谢!

----更新---- 经过更深入的分析后,我发现问题是我有另一个拦截器将 Auth header 添加到我的请求中。我创建了一个 stackblitz 示例来展示这个问题:https://stackblitz.com/edit/angular-interceptors-azhwak 在上面的示例中,您可以检查错误代码是否始终为 0(零),即使错误是 504。如果您注释掉另一个拦截器 (I2),代码将按预期工作。

不确定我是否做错了什么或者我是否不应该有多个拦截器(一些更新请求,一些更新响应)?

更新 2

用户@AngularInDepth.com 是对的,问题是没有提供 CORS。设法让它使用不同的服务工作。但现在我面临一个不同的问题,我只想在第一次重试后调用第二个拦截器 (I2)。有办法吗?

查看更新后的示例:https://stackblitz.com/edit/angular-interceptors-ckbvsb

谢谢

问题出在服务 https://httpstat.us/504 本身。当您向请求添加自定义 header 时,它无法正确处理 CORS,因此 XHR 请求错误而不是发出请求。当 XHR 错误时,您会得到 0 状态,因为没有发出请求。 Here is the plunker 证明了这一点和代码:

request() {
    const url = 'https://httpstat.us/504';

    var xhr = new XMLHttpRequest();  
    xhr.open('GET', url);      

    // when commented out `onload` handler is executed, otherwise `onerror`    
    // xhr.setRequestHeader('any', 'any');

    xhr.onload = () => {console.log('loaded')};
    xhr.onerror = () => {console.log('errror')};

    xhr.send();
}