ajax 在 Chrome 浏览器中调试 XHR

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1535462/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-06 10:49:23  来源:igfitidea点击:

debug XHR in chrome browser

ajaxgoogle-chrome

提问by lovespring

How to see the post content in chrome?

如何在chrome中查看帖子内容?

采纳答案by bdonlan

One option would be to use a normal packet sniffer like wireshark.It seems that chrome now supports directly sniffing XHR, see below.

一种选择是使用普通的数据包嗅探器,如wireshark看来chrome现在支持直接嗅探XHR了,见下文。

回答by d34dh0r53

Start up the Developer tools (Shift+Ctrl+Jon Linux) and click Enable Resource Tracking. The page will refresh. Click on the Resources button, XHRs are colored yellow. To see the post content simply click on the resource. The POST content is in the Request Headers. You can also filter out just the XHRs with the XHR button in the bar below the tabs.

启动开发人员工具(Shift+Ctrl+J在 Linux 上)并单击Enable Resource Tracking。页面将刷新。单击“资源”按钮,XHR 为黄色。要查看帖子内容,只需单击资源。POST 内容位于请求标头中。您还可以使用选项卡下方栏中的 XHR 按钮仅过滤掉 XHR。

Hope this helps,
d34dh0r53

希望这有帮助,
d34dh0r53

回答by russellfeeed

On Windows, Chrome 12, I had to right-click somewhere in the console window and tick XMLHttpRequest logging to enable this.

在 Windows、Chrome 12 上,我必须右键单击控制台窗口中的某处并勾选 XMLHttpRequest 日志记录以启用此功能。

回答by Jonathan Lin

2015 Update

2015年更新

Chrome version 43 now, go to Settings > General > Consoleand check the "Log XMLHttpRequests" option.

Chrome 现在是 43 版,去Settings > General > Console检查“ Log XMLHttpRequests”选项。

Update: I wanted to see the XHR Object, but it seems I still can't do that despite the logging.

更新:我想查看 XHR 对象,但尽管进行了日志记录,但似乎我仍然无法做到这一点。

回答by Philluminati

In the Javascript consolepane right clickand tick the "Log XMLHttpRequests" option. Then in the developer tools section choose the network tab.

Javascript 控制台窗格中,右键单击并勾选“ Log XMLHttpRequests”选项。然后在开发人员工具部分选择网络选项卡。

When you fire the Ajax request a new item will (sometimes delayed) appear in the network tab. Click on it to inspect it and then choose "Headers".

当您触发 Ajax 请求时,网络选项卡中将出现一个新项目(有时会延迟)。单击它进行检查,然后选择“标题”。

That will show you the post data you just sent.

这将显示您刚刚发送的帖子数据。

回答by Yash Ranadive

2015 Update

2015年更新

The latest chrome forces you to select the request (represented by a small blue dot) in the timeline. Use the slider hooks to zoom in to the time you sent the request after the page loaded in your browser. You will see the request(s) in the pane below the timeline(which was hidden in my case and I had to drag the dev console much deeper in to the page real estate). I'm guessing google added this so you could track events across time better.

最新的 chrome 强制您在时间轴中选择请求(由一个小蓝点表示)。使用滑块挂钩放大浏览器中加载页面后发送请求的时间。您将在时间线下方的窗格中看到请求(在我的案例中隐藏,我不得不将开发控制台更深入地拖到页面空间中)。我猜谷歌添加了这个,所以你可以更好地跟踪事件。

回答by Gino

2020 Update

2020 更新

In the current version of Chrome (Google Chrome 81.0.4044.138) you can simply

在当前版本的 Chrome (Google Chrome 81.0.4044.138) 中,您可以简单地

  • Open the developer tools
  • Navigate to the console
  • Click on the console settings (represented by the sprocket widget near the top right corner)
  • Toggle on 'Log XMLHttpRequests'
  • 打开开发者工具
  • 导航到控制台
  • 单击控制台设置(由右上角附近的 sprocket 小部件表示)
  • 切换“记录 XMLHttpRequests”