chrome devtool如何检查form.submit（）提交的表单数据答案

【问题标题】：chrome devtool how to inspect form data submitted by form.submit()chrome devtool如何检查form.submit（）提交的表单数据
【发布时间】：2018-12-10 22:36:00
【问题描述】：

xhr content-type form-data 如上图所示，我可以在 chrome devtool 上检查 xhr 提交的表单数据内容

form.submit() form-data 但是，我看到一个旧库使用默认的 form.submit() 方法上传图像。从请求标头中，它显示“Content-Type: multipart/form-data;boundary=----...”。但是请求正文（表单数据部分）甚至没有出现在开发工具上。

我很少使用默认提交方法。这是chrome的默认行为吗？如果是这样，为什么？有什么解决方法吗？因为我想查看 Content-Disposition。

编辑：

尝试了“保留日志”选项，但没有成功。似乎是 chrome 上的错误，因为我可以在 Edge 和 Firefox 上看到请求有效负载。

【问题讨论】：

标签： javascript google-chrome

【解决方案1】：

您是否尝试过检查 Chrome 开发工具中的保留日志选项，请参见这张图片：

https://ibb.co/cxNRCDD

当您发送表单并且浏览器正在刷新时，chrome 开发工具会丢失日期，所以如果是这种情况，您只需检查“保留日志”选项

【讨论】：

【解决方案2】：

您可以使用submit事件输出数据。

const form = document.querySelector('#formId');
form.addEventListener('submit', console.log);

如果您的表单使用preventDefault();，那应该可以正常工作

【讨论】：