如何在Chrome中调试HTTP POST?

j9per5c4  于 2023-09-28  发布在  Go
关注(0)|答案(8)|浏览(447)

我想查看在Chrome中发送的HTTP POST数据。
数据现在在内存中,我可以重新提交表单。
我知道如果我重新提交,服务器会抛出一个错误。我可以查看Chrome内存中的数据吗?

g9icjywg

g9icjywg1#

1.进入Chrome开发者工具(Chrome菜单->更多工具->开发者工具)
1.选择“网络”选项卡
1.刷新您所在的页面
1.您将获得在网络控制台打开时发生的http查询的列表。在左边选择其中一个
1.选择“标题”选项卡
瞧!

ql3eal8s

ql3eal8s2#

您可以使用Chrome DevTools过滤HTTP POST请求。只需执行以下操作:
1.打开Chrome DevTools(Mac上为Cmd+Opt+I,Windows上为Ctrl+Shift+I或F12),然后单击“网络”选项卡
1.点击“过滤器”图标
1.输入您的筛选方法:method:POST
1.选择要调试的请求
1.查看要调试的请求的详细信息

截图

使用Chrome Version 53进行测试。

0yycz8jy

0yycz8jy3#

您可以使用Canary version of Chrome查看POST请求的请求负载。

ttp71kqs

ttp71kqs4#

在Chrome 96上DevTools网络选项卡;

点击请求后,会出现一个“Payload”选项卡,其中显示了表单数据:

您可以查看url编码/解码的数据:

您可以查看源/解析的数据:

  • 即使方法是GET*,你也可以看到Payload作为查询字符串参数:

l7mqbcuq

l7mqbcuq5#

另一个可能有用的选项是专用的HTTP调试工具。有几个可用的,我建议HTTP Toolkit:我一直在做的一个开源项目(是的,我可能有偏见),为自己解决同样的问题。
主要的区别是可用性和功能。Chrome开发工具适合简单的事情,我建议从那里开始,但是如果你很难理解那里的信息,并且你需要更多的解释或更多的功能,那么适当的专注工具会很有用!
在这种情况下,它将显示您正在寻找的完整POST主体,并带有友好的编辑器和突出显示(全部由VS Code提供支持),以便您可以挖掘。当然,它会给予你请求和响应头,但是对于你可以看到的每个标准头和状态码,它会提供额外的信息,比如来自MDN(Mozilla Developer Network)的文档。
一张图片胜过一千个StackOverflow答案:

yuvru6vn

yuvru6vn6#

它有一个棘手的情况:如果您提交了一个帖子表单,那么Chrome将打开一个新的标签页来发送请求。到目前为止都是正确的,但是如果触发了下载文件的事件,该选项卡将立即关闭,这样您就无法在开发者工具中捕获此请求。
解决方法:在提交发布表单之前,需要切断您的网络,这样会导致请求无法发送成功,从而导致标签页无法关闭。然后您可以在Chrome Devtool中捕获请求消息(如有必要,刷新新标签)

g9icjywg

g9icjywg7#

网络选项卡是所有你需要的.

holgip5t

holgip5t8#

其他人做了非常好的答案,但我想用一个额外的开发工具来完成他们的工作。它被称为Live HTTP Headers,你可以将它安装到你的Firefox中,在 Chrome 中,我们有类似this的插件。
用它工作很容易。
1.使用Firefox浏览器,导航到您希望将帖子请求发送到的网站。
1.在Firefox菜单中 * 工具->Live Http头 *
1.一个新的窗口弹出,所有的http方法的细节将被保存在这个窗口中。在这一步你不需要做任何事情。
1.在网站中,做一个活动(登录,提交表格等)
1.看看你的插件窗口。都记录下来了。
请记住,您需要检查捕获 *。

相关问题