无法访问 JS 中的 fetch() 响应位置 header

Question

我遇到的问题已在 Whosebug 和其他平台 (1,) 上讨论过，但所提供的解决方案对我来说是不可能的。

我正在尝试通过 POST 请求和 fetch() 从 BlueSnap（支付处理公司，details about the exact action can be found here）获取令牌。请求正在运行，令牌正在通过响应中的位置 header 发送给我。我可以通过 Chrome 开发工具看到 header 和所需的标记，但我无法在我的 JS 代码中获取和使用它。 response.headers object 是空的，我试图访问 response.header.Location 的任何方式都失败了。

我试过这个：

console.log(response.headers.get('location'))

还有这个

for(const header of response.headers){
  console.log(header);
}

但是 none 这似乎有效。

我试图添加这个：

'Access-Control-Expose-Headers': 'location'

添加到请求中的 header 列表中，因此它适合 CORS policy requiremnts，但没有帮助。我认为这应该插入服务器端，而不是客户端。我的猜测是我不是第一个遇到这个问题的人，但是 BlueSnap 的客户支持没有解决这个问题的方法。唯一可能的解决方案是在服务器上添加 'Access-Control-Expose-Headers': 'location' 吗？

我的问题是：我如何访问这个 http 响应位置 header，它被发送到我的浏览器，但目前不能用于我的 JS 代码.

非常感谢您的时间和精力！

*我不认为我对这个具体问题很重要，但我正在使用 ReactJS 处理这个项目

Answer 1

你不能。

用于在 Web 浏览器（fetch 和 XMLHttpRequest）中从 JavaScript 发出 HTTP 请求的 APIs 遵循重定向透明.

response object 将包含对 location header 中指定位置的请求的响应。您永远无法访问包含重定向指令的响应。

如果您阅读 API 的 documentation，它表示：

You create a Hosted Payment Fields token for the specific checkout session, using a server-to-server API call.

…所以你不应该首先从 client-side JS 访问它。

无法访问 JS 中的 fetch() 响应位置 header

Can't accses fetch() response location header in JS

javascript

reactjs

http-headers

cors

bluesnap