forms - "Request Payload"与 "Form Data"之间有什么区别，如 Chrome 开发工具网络选项卡中所示

Question

我有一个必须支持的旧 Web 应用程序(不是我写的)。

当我填写表单并提交然后检查 Chrome 中的“网络”选项卡时，我会看到“请求负载”，而我通常会看到“表单数据”。两者之间有什么区别，什么时候发送一个而不是另一个？

用谷歌搜索，但没有真正找到任何解释这个的信息(只是人们试图让 javascript 应用程序发送“表单数据”而不是“请求负载”。

Answer 1

请求负载——或者更准确地说:payload body of a HTTP Request

• 是 POST or PUT Request 正常发送的数据.它是标题和 HTTP Request 的 CRLF 之后的部分.

带有 Content-Type: application/json 的请求可能如下所示:

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

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

如果您通过 AJAX 提交此内容，浏览器只会向您显示它作为有效负载正文提交的内容。这就是它所能做的，因为它不知道数据来自哪里。

如果您使用 method="POST" 和 Content-Type: application/x-www-form-urlencoded 或 Content- 提交 HTML 表单类型:multipart/form-data 您的请求可能如下所示:

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

foo=bar&name=John

在这种情况下，表单数据是请求负载。在这里，浏览器知道更多:它知道 bar 是提交表单的输入字段 foo 的值。这就是它向您展示的内容。

因此，它们在 Content-Type 上有所不同，但在提交数据的方式上没有区别。在这两种情况下，数据都在消息正文中。 Chrome 会区分数据在开发者工具中的呈现方式。