Qual è la differenza tra "Richiedi payload" e "Dati modulo" come si vede nella scheda Rete degli strumenti di sviluppo di Chrome

Ho una vecchia applicazione web che devo supportare (che non ho scritto).

Quando compilo un modulo e invio quindi controllo la scheda "Rete" in Chrome vedo "Richiedi payload" dove normalmente vedrei "Dati modulo". Qual è la differenza tra i due e quando verrebbe inviato uno anziché l'altro?

Ho cercato su Google questo, ma non ho trovato alcuna informazione che lo spieghi (solo le persone che cercano di ottenere app javascript per inviare "Dati modulo" invece di "Richiedi payload".

Il payload della richiesta - o per essere più precisi: corpo del payload di una richiesta HTTP - sono i dati normalmente inviati da una richiesta POST o PUT . È la parte dopo le intestazioni e il CRLFdi una richiesta HTTP .

Una richiesta con Content-Type: application/jsonpotrebbe apparire così:

POST /some-path HTTP/1.1
Content-Type: application/json

{ "foo" : "bar", "name" : "John" }

Se lo invii per AJAX, il browser ti mostra semplicemente cosa sta inviando come corpo del payload. Questo è tutto ciò che può fare perché non ha idea da dove provengano i dati.

Se si invia un HTML-Form con method="POST"e Content-Type: application/x-www-form-urlencodedo Content-Type: multipart/form-datala vostra richiesta potrebbe essere simile a questa:

POST /some-path HTTP/1.1
Content-Type: application/x-www-form-urlencoded

foo=bar&name=John

In questo caso i dati del modulo sono il payload della richiesta. Qui il Browser ne sa di più: sa che la barra è il valore del campo di input foo del modulo inviato. Ed è quello che ti sta mostrando.

Pertanto, differiscono nel modo, Content-Typema non nel modo in cui i dati vengono inviati. In entrambi i casi i dati si trovano nel corpo del messaggio. E Chrome distingue come i dati ti vengono presentati negli Strumenti per gli sviluppatori.

In Chrome, la richiesta con "Content-Type: application / json" viene visualizzata come Richiesta PayedLoad e invia i dati come oggetto json.

Ma la richiesta con 'Content-Type: application / x-www-form-urlencoded' mostra i dati del modulo e invia i dati come chiave: coppia di valori , quindi se si dispone di un array di oggetti in una chiave , il valore di quella chiave risulta piatto :

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

invia

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