Chrome 未在“网络”选项卡中显示 OPTIONS 请求答案

【问题标题】：Chrome not showing OPTIONS requests in Network tabChrome 未在“网络”选项卡中显示 OPTIONS 请求
【发布时间】：2019-12-16 00:21:08
【问题描述】：

我的 Web 客户端应用程序正在通过 fetch API 设置 HTTP POST 请求。

我看到 OPTIONS 预检请求是通过调试代理（Charles 代理）发送的，但它们未显示在 Google Chrome 开发人员工具\网络选项卡中。

我没有在网络标签上设置任何过滤器。我记得 OPTIONS 请求在那里可见，但不再可见。如何将它们带回来？

【问题讨论】：

【解决方案1】：

自 2021 年起，在 CHROME 中，OPTIONS 请求在“网络”选项卡过滤器“其他请求”中可见

要与 XHR 一起查看它，只需 CTRL+单击并选择您想要查看的请求过滤器。

更新（4 月 17 日）Chrome 版本 90.0.4430.72 再次隐藏了选项请求：(

【讨论】：

chrome 是怎么回事？这是在最近约 10 个版本中显示这些请求的第 4 次切换。我跟不上。
除此之外，预检似乎被缓存了。在这里，我们隐身...
根据此页面上其他人的建议，我刚刚为此切换到了 Firefox，并且没有额外的配置，我可以很容易地看到 OPTIONS 请求。接受@Takashi Toyoshima 的回答，这让我想知道 Firefox 是否安全性较低，或者 Chromium 团队是否只是无法弄清楚如何做 Mozilla 所做的事情。

【解决方案2】：

我是 Chromium Project 的 Takashi，负责执行 Out-Of-Blink/Render CORS 项目。

该项目旨在引入一个进程隔离的 CORS 实现以提高安全性和隐私性，并且许多与网络相关的新功能都依赖于这种新实现。不幸的是，我们暂时禁用了 DevTools 中的预检支持，因为事实证明继续支持它会削弱安全性和隐私性。在此期间给您带来不便，敬请见谅。

好消息是 Chrome 83 现在以一种安全的方式再次实现了 CORS preflight DevTools 支持。因此，您可以像在 Out-Of-Blink/Renderer CORS 之前那样监控 CORS 预检请求。

最好的，

【讨论】：

我在 macOS 上运行最新的 chrome，但在网络检查器中仍然看不到 OPTIONS。帮忙？
Chrome 83.0.4103.116 (Mac OS) - 在网络面板中仍然看不到飞行前信息。是否有一些标志需要打开？
Chrome 83.0.4103.116 (Official Build) (64-bit) on MacOs 仍然没有为我显示飞行前。并且实验性的 out-of-blink-cors 选项不再可用。
对于运行 Chrome 84/Win10 的我来说，如果您选择“全部”过滤器，OPTIONS 请求会显示在“网络”选项卡中，但如果您选择“XHR”过滤器则不会。这很烦人，因为那时我必须处理几十个我不关心的其他请求。知道为什么不能在两个地方都显示它们吗？
CORS 预检（OPTIONS 请求）并不总是发送，即使请求是跨域的。请参阅 MDN 文档作为可读参考。对于简单的请求，预检被省略。只要发送了预检，当前的 Chrome 就会在 DevTools 的网络选项卡中显示该请求。 developer.mozilla.org/en-US/docs/Glossary/Preflight_request

【解决方案3】：

即使更改选项并在我的计算机上重新启动，Chrome 81 似乎也没有显示任何内容。

作为替代解决方案，我开始使用 Firefox 及其网络选项卡进行开发。

【讨论】：

【解决方案4】：

您需要转到：chrome://flags/#out-of-blink-cors，禁用该标志，然后重新启动 Chrome。

【讨论】：

这行得通。但我在链接页面中找不到这个“out-of-blink-cors”设置的作用。 Blink 是 chrome 引擎的名称 - 那么 cors 是什么组件而不是它呢？对于非 chrome 扩展的普通网站，有哪些有效的变化？
我认为 cors 的处理被转移到引擎中 - 比 devtools 可以访问的级别更低。但您可以禁用该优化。
这种行为会让新手开发者的生活变得更加艰难。这基本上隐藏了错误的答案。
Chrome 79+ 不再显示预检 CORS 请求。您可以使用例如 Firefox 来查看它。
来自 Chrome 实现相关代码的好消息：请参阅stackoverflow.com/a/62590759/441757 的答案“Chrome 83 以安全保护的方式再次实现了 CORS 预检 DevTools 支持。因此，您可以像在 Out-Of-Blink/Renderer CORS 之前那样监控 CORS 预检请求”