为什么Chrome开发者工具会自动阻止请求？

Question

我正在尝试构建一个PWA（渐进式Web应用程序），但是Chrome开发工具控制台警告说它正在阻止我的CSS和图标文件。

请求被DevTools阻止："https://example.com/styles/style.css"。

我找不到任何关于自动发生这种情况的信息，并且据我所知，只有在用户手动请求阻止脚本时才会发生。 Chrome除了被阻止之外，没有提供任何其他关于警告的信息。

- Bakala

---

一样的情况。我关闭并重新打开了开发者工具，然后它就消失了。没有人知道这个消息是关于什么的吗？ - user1383029

感谢@user1383029的建议...关闭开发工具并重新打开可以解决问题。我无法告诉你为什么或如何开始出现这个问题。我甚至在Chrome中禁用了请求阻止，但它仍然会阻止请求。 - nicetoCyou

Answer 1

这个错误意味着域名或URL在开发者工具中被阻止了。大多数情况下，只是因为开发人员在没有注意的情况下阻止了该请求。

要解除阻止，只需按照以下步骤操作：

• 打开开发者工具
• 进入网络选项卡
• 右键点击被阻止的请求
• 然后单击“取消阻止 <request-url>”

- Medteck

---

还要检查“请求阻止”选项卡中是否存在带通配符的阻塞（例如 localhost:3000/icons/*）。无论如何，在我的情况下，当使用Lighthouse性能分析器时它仍会阻止请求。 - kca

我的另一个评论似乎已经消失了，我不知道为什么。无论如何，这并没有回答问题，即为什么Chrome DevTools会阻止请求。它只是重申了已经包含在问题中的信息。它还暗示可能是由于开发人员的错误，这是一个巨大（且不准确）的假设。 - Scott Martin

在菜单中没有“取消阻止”选项。 - Arrow_Raider

Answer 2

当你在devTools上时，只需按ESC键，就会看到这些选项卡：

控制台 / 问题 / 网络请求阻止 / 最新内容 和 搜索 转到网络请求阻止选项卡，然后你可以取消所有已屏蔽的内容。在我的情况下是本地主机。

然后再次按ESC键。

- Elyas

Answer 3

我在尝试给我的网站添加一个网站图标时遇到了同样的问题。但是在将网站图标的位置更改后，问题消失了。

我将 .favicon.ico 更改为 ./assets/images/favicon.ico

- Dinesh Kumar