如何在Chrome中调试HTTP POST？

Question

我想查看Chrome中发送的HTTP POST数据。

现在数据在内存中，我可以重新提交表单。

我知道如果我重新提交服务器会抛出错误，无论如何我可以查看Chrome内存中的数据吗？

Answer 1

1. 转到Chrome开发者工具（Chrome菜单 - ＆gt;更多工具 - ＆gt;开发人员工具）
2. 选择“网络”标签
3. 刷新您正在使用的页面
4. 当网络控制台打开时，您将获得发生的http查询列表。在左侧选择其中一个
5. 选择“标题”标签

瞧！

Answer 2

您可以使用Chrome DevTools过滤HTTP POST请求。只需执行以下操作：

1. 在Mac上打开Chrome DevTools（ Cmd + 选择 + I ， Ctrl + Shift < / kbd> + I 或 F12 on Windows）并点击＆＃34;网络＆＃34;标签
2. 点击＆＃34;过滤＆＃34;图标
3. 输入您的过滤方式：method:POST
4. 选择要调试的请求
5. 查看要调试的请求的详细信息

<强>截图



使用Chrome版本53进行测试。

Answer 3

另一个有用的选项是专用的HTTP调试工具。我建议HTTP Toolkit有一些可用的方法：我一直在努力的一个开源项目（是的，我可能有偏见），可以自己解决这个问题。

主要区别在于可用性和功能。 Chrome开发人员工具非常适合简单的事情，我建议从这里开始，但是如果您在努力了解那里的信息，并且需要更多的解释或更多的功能，那么适当的专注工具可能会有用！

在这种情况下，它将通过友好的编辑器和加亮显示（全部由VS Code支持）向您显示您正在寻找的完整POST正文，以便您进行深入研究。它会为您提供请求和响应标头，当然，还会提供更多信息，例如MDN中的文档（Mozilla Developer Network），您可以看到每个标准标头和状态代码。

一张图片值得一千个StackOverflow答案：

Answer 4

其他人提出了非常好的答案，但我想用一个额外的开发工具完成他们的工作。它被称为实时HTTP标头，您可以将其安装到Firefox中，而在 Chrome 中，我们可以使用相同的插件this

使用它很容易。

1. 使用您的Firefox，导航到您要向其发送请求的网站。

2. 在您的Firefox菜单中 工具 - ＆gt;直播Http标题

3. 会弹出一个新窗口，所有http方法详细信息都将保存在此窗口中。您无需在此步骤中执行任何操作。

4. 在网站上，进行活动（登录，提交表格等）

5. 看看你的插件窗口。全部记录下来。

请记住，您需要检查 捕获 。

Answer 5

“网络”选项卡就是您所需要的...

Answer 6

我遇到了一个棘手的情况：如果您提交邮寄表格，那么Chrome将打开一个新标签来发送请求。到现在为止，但是如果它触发下载文件的事件，则此选项卡将立即关闭，以使您无法在开发工具中捕获此请求。

解决方案： 在提交邮寄表格之前，请切断您的网络，这会使请求无法成功发送，因此该选项卡不会关闭。然后，您可以在chrome开发工具中获取请求消息（如有必要，请刷新新标签）