跨域请求获取不到特定 header 头的解决办法

一个需求是这样:要用 js 来读 ajax 接口中的header头的某个字段,例如 Etag
这时有可能出现两种报错信息。
第一:全部 Response 字段里获取不到指定字段。

1
2
3
4
5
console.log(xhr.getAllResponseHeaders());
/*
content-length: 44
content-type: application/json; charset=utf-8
*/

发现没有 Etag 这个字段。

第二:获取指定字段时提示错误(Cross Domain Resource Sharing GET: ‘refused to get unsafe header “xxx”‘ from Response)

1
2
xhr.getResponseHeader('Etag')
VM172:1 Refused to get unsafe header "Etag"

这是因为跨域请求中,不能随意去读取 Response 中的字段,需要在网关(nginx、apache)等加上如下字段:

1
Access-Control-Expose-Headers: ETag

显式地把字段暴露出来,才能在 ajax 请求中使用。

加上以上字段之后,发现可以获取到了:

1
2
3
4
5
6
console.log(xhr.getAllResponseHeaders());
/*
content-length: 44
content-type: application/json; charset=utf-8
Etag:xxxx
*/

跨域请求获取不到特定 header 头的解决办法

https://blog.weixinbook.net/2023/11/26/cros-refused-to-get-unsafe-header.html

作者

David

发布于

2023-11-26

更新于

2023-11-27

许可协议

评论

:D 一言句子获取中...