Fetch API - 重定向选项 redirect: manual 的作用是什么？

Question

最近我一直在尝试使用JavaScript Fetch API。据我所知，默认情况下，所有重定向都会透明地处理，最终我会从重定向链中的最后一个调用中获得响应。

然而，我可以使用{redirect：'manual'}调用fetch，在这种情况下，它将返回一个opaqueredirect响应，并且没有可用的信息。详见https://fetch.spec.whatwg.org/#concept-filtered-response-opaque-redirect

不透明重定向过滤器响应是一种类型为“opaqueredirect”的已过滤响应，状态为0，状态消息为空字节序列，头列表为空，主体为null，尾部为空的响应。

https://fetch.spec.whatwg.org/#http-fetch称如果将重定向设置为“manual”，则响应将变为opaqueredirect：

  

根据请求的重定向模式切换：
  ...
  - 手动
    将响应设置为一个不透明重定向过滤器响应，其内部响应为actualResponse。

规范还说：

  

换句话说，不透明的过滤响应和不透明的重定向过滤响应几乎与网络错误无法区分。

考虑到这一点，为什么在使用Fetch API时要将重定向设置为manual呢？对我来说似乎没有什么用处。是否有用例可以使用此功能？

- civilu

---

我刚刚使用了它。我正在请求一个有3个重定向的服务器，只是为了定义一些cookies。fetch没有传递那些cookies，所以我手动传递了它们。 - Ian

我正在使用重定向：手动，以展开URL。 - Sanyam Jain

在尝试使用React Router实现登录表单时，我遇到了redirect属性。成功登录后，我希望服务器返回302，但我想使用客户端路由来处理它，而不是向服务器发出另一个请求。我认为manual值是我需要的，但由于opaqueredirect响应不包含Location头（或任何其他头），所以我猜我必须用其他方式来处理它。我不明白为什么要这样实现。 - Ron Inbar

Answer 1

简短的回答是：除非您像https://github.com/whatwg/fetch/issues/66中所涵盖的服务工作者代码一样进行操作，否则您永远不需要使用redirect: 'manual'。

更长的回答是：根据HTML规范，浏览器在开始导航到资源时首先将重定向模式设置为manual。这是规范中对manual重定向模式的唯一用途。

但由于Fetch API基本上公开了浏览器用于获取内部原语的相同原语，因此它公开了一个manual重定向模式。然而，仅因为API公开了特定原语，并不意味着在前端代码中有很好的用途。

规范曾要求即使您可以使用redirect：'manual'调用API，但如果您这样做，浏览器会抛出异常，因为当时没有人提供任何有效的理由来设置该模式，除了浏览器执行导航之外。

但由于https://github.com/whatwg/fetch/issues/66，这种行为已更改，其中提供了一个（角落）情况，需要在服务工作者代码中使用redirect：'manual'。

在Fetch API中您也可以设置mode: 'no-cors'，但它在Web应用程序代码中的实用性非常有限。最初添加它只是因为浏览器对某些请求使用它，因此Fetch API公开了它。但这是另一种情况，仅适用于服务工作者-用于缓存响应以稍后按原样返回，而不需要检查响应（mode: 'no-cors' 防止Web应用程序代码执行此操作）。

- sideshowbarker

---

第一段是错误的。你需要在 service workers 之外使用 redirect: 'manual'。想象一下，你只是想为任何原因防止目标端点被获取。 - Robo Robok

是的，这并不是真正的答案。我现在有一个必须拦截重定向的情况，因为在摘要认证中，您需要增加nc和cnonce以正确跟随重定向。 - Gunther Schadow