devtools：在新选项卡中打开响应 HTML

Question

如果 ajax/fetch 请求失败，我的框架 (django) 会显示一个不错的调试页面，其中包含很多有用的信息。

在 chrome devtools 中，我可以看到这个调试页面的预览。 但是 devtools 中的 window 太小了。

有没有办法在新选项卡中打开POST请求的 output ？

如果我使用右键单击“在新选项卡中打开”，那么 chrome 会执行 GET。 但是 GET 不会触发我想调试的异常。

Answer 1

我认为你能做的最好的就是在Postman中重新创建场景。 Postman 有一个称为拦截器的工具，它可以同步 cookies 并捕获来自 Chrome 的请求。

Postman 拦截器使用chrome 扩展，如果您从应用程序启用拦截器，它将捕获的请求发送到 Postman 应用程序。

但是可能存在安全风险，Chrome 扩展程序将拥有对所有页面的站点访问权限，也许您可以通过从扩展程序设置（从设置>扩展程序>邮递员拦截器）限制站点访问来限制它：

或者，如果您不想使用拦截器，则可以从Headers部分复制有效负载（表单数据）和请求标头，然后将它们放入 Postman 并发出请求。 或者你可以使用requests库来做同样的事情。

Answer 2

使用开发工具的全屏模式而不是在单独的浏览器选项卡中打开怎么样？

1. 点击 chrome 开发工具右侧的三个点
2. 单击第一个选项（两个重叠的正方形），它将以全屏模式打开 chrome 开发工具。

请参考下图。