Chrome 开发者工具不会在网络选项卡中捕获表单提交，为什么？答案

【问题标题】：Chrome developer tool does Not capture a form submit in network tab, Why?Chrome 开发者工具不会在网络选项卡中捕获表单提交，为什么？
【发布时间】：2018-05-05 13:14:08
【问题描述】：

一个简单的html页面，

<body>
    <form method="POST" action="abc">
        <input ... />
    </form>
</body>

用javascript提交表单

document.getElementsByTagName('form')[0].submit()

请求确实已提交（服务器返回一个文件作为下载），但我在网络选项卡中找不到任何活动。

有什么想法吗？提前致谢。

更新： Firefox 在捕捉这一点方面做得很好。

【问题讨论】：

这个html页面是你的弹出页面还是普通页面？您是在检查弹出页面的网络{右键单击弹出页面>检查>网络}还是普通页面{右键单击浏览器页面>检查>网络}？
因为您创建了一个新窗口，其中包含由提交过程加载的新页面，并且会清除先前窗口（页面）中的所有网络历史记录
@charlietfl 如图所示，他勾选了保留日志选项，刷新后不会清除控制台，对吧？
@Yazan W Yusuf，这是一个普通的页面，我简化了一点。
能否请您提供更多详细信息。该脚本在内容页面中，对吧？

标签： javascript google-chrome-devtools forms

【解决方案1】：

来自https://stackoverflow.com/a/55197547/3774338

如果它触发了下载文件的事件，Chrome 将创建一个新选项卡，该选项卡将立即关闭，因此您无法在开发工具中捕获此请求。

解决方案：在网络选项卡中选中“离线”复选框，将无法发送请求，因此选项卡不会关闭。

【讨论】：