Яка різниця між "Запит корисного навантаження" від "Дані форми", як це видно на вкладці Мережа інструментів розробників Chrome

У мене є старий веб-додаток, який я маю підтримувати (який я не писав).

Коли я заповнюю форму та подаю, тоді перевірте вкладку "Мережа" в Chrome, я бачу "Запит корисної навантаження", де я зазвичай бачу "Дані форми". Яка різниця між двома і коли один буде відправлений замість іншого?

Подивилися це, але насправді не знайшли жодної інформації, яка б це пояснила (просто люди намагаються отримати програми JavaScript для надсилання "Форма даних" замість "Запит корисної навантаження".

Корисне навантаження запиту - або якщо бути точнішим: тіло корисного навантаження запиту HTTP - це дані, які зазвичай надсилаються за допомогою POST або PUT-запиту . Це частина після того, як заголовки і CRLFз HTTP запиту .

Запит з Content-Type: application/jsonможе виглядати так:

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

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

Якщо ви подаєте це за AJAX, браузер просто показує, що він подає як орган корисного навантаження. Це все, що він може зробити, тому що не має поняття, звідки беруться дані.

Якщо ви подаєте HTML-форму з method="POST"та Content-Type: application/x-www-form-urlencodedабо Content-Type: multipart/form-dataваш запит може виглядати так:

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

foo=bar&name=John

У цьому випадку дані форми - це корисне навантаження запиту. Тут Браузер знає більше: він знає, що бар - це значення foo-поля вводу поданої форми. І це те, що вам показує.

Отже, вони відрізняються, Content-Typeале не способом подання даних. В обох випадках дані знаходяться в тілі повідомлення. І Chrome відрізняє, як дані надаються вам в Інструментах для розробників.

У Chrome запит із "Content-Type: application / json" відображається як Request PayedLoad та надсилає дані як об'єкт json.

Але запит із "Content-Type: application / x-www-form-urlencoded" відображає дані форми і надсилає дані як Key: Pair Value , тому якщо у вас є масив об'єкта в одному ключі, він визначає значення цього ключа:

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

посилає

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