代码之家 › 专栏 › 技术社区 › Mr.H.

HttpClient缺少响应头

angular-httpclient angular6 angular

3

Mr.H. · 技术社区 · 7 年前

我最近正试着进入状态。我有一个分页的请求。

const myParams = new HttpParams().set('page', page.toString()).set('size', size.toString());
this.http.get<HttpResponse<User[]>>('https://localhost:8443/user/', {
      headers: new HttpHeaders({ 'Content-Type': 'application/json' }),
      params: myParams,
      observe: 'response'
    }).suscribe((response: HttpResponse<User[]>) => this.data = response.body);

X-Total-Count

.suscribe((response: HttpResponse<User[]>) => {
    this.data = response.body;
    this.totalCount = response.headers.get('X-Total-Count');
});

这就是headers对象的外观

"headers": {
    "normalizedNames": {},
    "lazyUpdate": null
  }

我确信X-Total-Count已经发送了。Firefox开发工具展示了这一点。你能告诉我如何把它包括在答复中吗?

更新

这个问题与被确定为重复的问题有以下不同:我没有问过如何检查完整的httpResponse。我自己想出来的。我一直在问为什么 headers 响应的属性不完整。

2 回复 | 直到 5 年前

1

49

Matthieu Riegler 6 年前

CORS请求仅公开6个安全列表头: Cache-Control Content-Language Content-Type Expires Last-Modified & Pragma .

为了使用CORS请求访问自定义头,服务器必须显式地将它们列入白名单。这可以通过发送响应头来完成: Access-Control-Expose-Headers

Access-Control-Expose-Headers: X-Total-Count, X-Paging-PageSize

MDN Source

2

8

Gyromite 6 年前

HttpResponse对象中的头是延迟加载的,所以 headers response.headers.keys() 查看所有可用的标头名称。顺便说一下,这也会强制将所有值加载到映射中 response.headers.headers

3

2

Igor Masliansky 7 年前

尝试添加 withCredentials: true 到http选项对象。

4

0

bladekp 5 年前

Access-Control-Expose-Headers 标题按名称。要实现这一点,您需要配置应用程序服务器,例如在Spring中使用 WebMvcConfigurer 您可以公开如下标题:

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry
                .addMapping("/**")
                .allowedOrigins("*")
                .exposedHeaders("X-Total-Count")
                .allowedMethods("*");
    }
}

使用此配置,您的浏览器,除了7个默认标题外:

Cache-Control
Content-Language
Content-Length
Content-Type
Expires
Last-Modified
Pragma

X-Total-Count 应用程序的标题。

5

0

Richard 5 年前

在我的例子中,邮递员能够获取自定义的“授权”标题,但Angular不能。我通过显式地公开自定义头来解决这个问题

@Bean
public CorsFilter corsFilter() {
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    CorsConfiguration config = new CorsConfiguration();
    config.setAllowCredentials(true);
    config.addAllowedOrigin("*");
    config.addAllowedHeader("*");
    // vvv
    config.addExposedHeader(HttpHeaders.AUTHORIZATION);
    // ^^^
    config.addAllowedMethod(HttpMethod.OPTIONS);
    config.addAllowedMethod(HttpMethod.GET);
    config.addAllowedMethod(HttpMethod.POST);
    config.addAllowedMethod(HttpMethod.PUT);
    config.addAllowedMethod(HttpMethod.PATCH);
    config.addAllowedMethod(HttpMethod.DELETE);
    config.setMaxAge(1800L);
    source.registerCorsConfiguration("/**", config);
    return new CorsFilter(source);
}