¿Cuál es la diferencia entre “Solicitud de carga” vs “Datos de formulario” como se ve en Herramientas de desarrollo de Chrome Pestaña de red

Tengo una aplicación web antigua que tengo que admitir (que no escribí).

Cuando llene un formulario y lo envíe, revisa la pestaña “Red” en Chrome. Veo “Solicitud de carga útil” donde normalmente vería “Datos del formulario”. ¿Cuál es la diferencia entre los dos y cuándo se enviaría uno en lugar del otro?

Busqué en Google esto, pero realmente no encontré ninguna información que explique esto (solo las personas que intentan obtener aplicaciones de JavaScript para enviar “Datos de formulario” en lugar de “Solicitar carga útil”).

    La carga útil de la solicitud, o para ser más precisos: cuerpo de la carga útil de una solicitud HTTP , es la información que normalmente se envía mediante una solicitud POST o PUT . Es la parte después de los encabezados y el CRLF de una solicitud HTTP .

    Una solicitud con Content-Type: application/json puede verse así:

     POST /some-path HTTP/1.1 Content-Type: application/json { "foo" : "bar", "name" : "John" } 

    Si envía esto por AJAX, el navegador simplemente le muestra lo que está enviando como cuerpo de carga. Eso es todo lo que puede hacer porque no tiene idea de dónde provienen los datos.

    Si envía un formulario HTML con method="POST" y Content-Type: application/x-www-form-urlencoded o Content-Type: multipart/form-data su solicitud puede verse así:

     POST /some-path HTTP/1.1 Content-Type: application/x-www-form-urlencoded foo=bar&name=John 

    En este caso, los datos del formulario son la carga útil de la solicitud. Aquí el navegador sabe más: sabe que la barra es el valor del campo de entrada foo del formulario enviado. Y eso es lo que te está mostrando.

    Por lo tanto, difieren en el tipo de Content-Type pero no en la forma en que se envían los datos. En ambos casos, los datos están en el cuerpo del mensaje. Y Chrome distingue cómo se le presentan los datos en las herramientas para desarrolladores.

    En Chrome, la solicitud con ‘Content-Type: application / json’ se muestra como Request PayedLoad y envía datos como objeto json.

    Pero la solicitud con ‘Content-Type: application / x-www-form-urlencoded’ muestra los datos del formulario y envía los datos como clave: Value Pair , por lo que si tiene una matriz de objetos en una clave , planifica el valor de dicha clave:

     { Id: 1, name:'john', phones:[{title:'home',number:111111,...}, {title:'office',number:22222,...}] } 

    envía

     { Id: 1, name:'john', phones:[object object] phones:[object object] }