Angular 6 拦截器未按预期工作

Question

我在Angular 6 中写了一个Http Interceptor。目标是在返回 302 status 时重新加载主页。（任何后端 API 返回 302 状态）我目前无法理解为什么 Interceptor 会这样。

代码如下：

@Injectable()
export class ResponseHandler implements HttpInterceptor{


    constructor(){

    }

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


     return next.handle(request).pipe(


            map((event: HttpEvent<any>) => {

                if(event instanceof HttpResponse){
                    if(event.status === 302){
                        console.log('HttpResponse 302 status ');
                        window.location.reload();
                        return EMPTY;
                    }
                }

            })
        )

    }

}

实际行为：

1)我首先明确访问主页。 (e.g: /home)

2) 但奇怪的是，最初调用获取家庭年龄本身并没有发生

3)似乎请求被阻止到达服务器。

4)当拦截器被移除时，这个初始调用正在发生(/home)

我无法理解为什么会出现这种行为？

为什么请求被阻止，因为我 没有篡改 请求应该按原样传递到后端 rest 端点。

只有当 HttpResponse 返回 302 error 代码时才应该被拦截。

有人可以帮忙吗？

Answer 1

问题是您忘记了 return 地图运算符中的值。地图运算符的主要目标是修改数据并 RETURN 返回。

         map((event: HttpEvent<any>) => {

            if(event instanceof HttpResponse){
                if(event.status === 302){
                    console.log('HttpResponse 302 status ');
                    window.location.reload();
                    return EMPTY;
                }
            }

            return event;  // here you return value back
        })

Angular 6 拦截器未按预期工作

Angular 6 Interceptor not working as expected

angular-http-interceptors

angular6