如何在我的应用程序中使用来自拦截器的 header

Question

我在后端的 HTTP 请求中添加了一个 responseWithHeader。我可以看到它正常工作，因为它出现在我的开发人员工具的网络选项卡中。

我在 Angular 中使用 interceptor 来处理 HTTP 请求和响应，但我遇到的问题如下：

我已将我的应用程序的版本号作为 header 添加到响应中，然后我需要将 header 中的此版本与我的 package.json 中声明的版本进行比较.如果响应 header 中的版本比 package.json 中的版本新，我想显示一个 `Snackbar`` 提示用户刷新页面。但是，我无法弄清楚如何 'extract' header 值，并将其解析为我的应用程序组件可以订阅的服务。

这是我的拦截器方法：

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const token = this.cookieService.get('token');
    let headers = req.headers;
    if (token) {
      headers = headers.append('Authorization', token);
    }

    const authReq = req.clone({
      headers: headers
    });

    return next.handle(authReq).pipe(
        map((event: HttpEvent<any>) => {
            if (event instanceof HttpResponse) {
              console.log(event.headers.get('x-web-frontend-version'));
            }
            return event;
        }));
  }

每当我尝试调用方法时，例如 this.baseService.handleVersion(INSERT HEADER VALUE)，应用程序都会抛出错误。如何将此 header 解析为服务方法？

Answer 1

你需要header“正确”，解决方法在这里：Angular 2 http Observable request not returning response header
创建一种中介服务以将版本保留为主题，并在您需要的任何地方订阅

如何在我的应用程序中使用来自拦截器的 header

How to use header from interceptor in my app

angular

http

httpresponse

interceptor

angular-services