How to see form data with enctype = “multipart/form-data” in Chrome debugger

Question

I\'m trying to visualize form data in Chrome Debugger. Data are sent through a from which loads a file and sends some text. Something like this one:

Answer 1

Just looking at the Headers tab in the Network tab in chrome dev tools shows me the entered data (Chrome Version 73):

Keep in mind that in order for requests to show up in the Network tab you have to open the chrome devtools before the request happens.

Answer 2

The problem still exists with chrome versions 77 and 78. It is working with tools like Fiddler.

See the answers to this question: Should a "multipart/form-data" POST request actually contain a string with the data of an uploaded image?

They suggest to use Fiddler. Chrome developer tools do not show the data, because the developers chose not to for performance reason and acknowledge this is a limitation of current design.

See also this Chrome bug report.

Answer 3

I tested on my platform: Chrome 79.0.3945.130 (Official Build) (64-bit), Windows 10. I confirm that this problem remains on the up to date version of Chrome (as of 1/22/2020).

To be precise, the problem I found in Chrome 79.0.3945.130 (and Chromium Edge 79.0.309.68 as well) is as follows:

1. For a multipart/form-data POST request, if we don't specify any file to upload and hit the form submit button, we do see the "Form Data" section under Network tool's headers tab. The "Form Data" section lists all regular form fields, e.g., a form field <input type="text" name="title" value="hello Chrome"/> is shown in the following pic, and the file field shows nothing because I didn't upload any file.

2. For a multipart/form-data POST request, if we actually upload a file, regardless of its size (such as 0B), the entire "Form Data" section disappears, including regular form fields! See the following pic in which I collapsed all sections under Headers to demonstrate the point.

I agree it makes good sense to hide the file content for performance reasons as described in this question and this discussion, but it makes no sense to hide all regular form fields as well. I believe this is a Chrome bug.

In FireFox, we see all Form Data and uploaded file content under F12 dev tools > Network > Params. In the following example, I uploaded file.txt with the content: hello Firefox from file.txt.

So Firefox offers a temporary solution before Chrome addresses this issue.