http请求时Form Data & Request Payload的区别

太_2_真_人

在与后端的调试中发现一个问题,使用post发请求时,发送的params后端一直说没收到参数,F12发现参数确确实实已经发送了。如图:

formData.png

使用swagger发送同样的参数请求却可以接收到:

RequestPayload.png

通过比对发现,两者的不同在于一个参数类型是Form Data,一个是Request Payload。什么意思呢?

百度一下 你就知道

Request Payload更准确的说是http request的payload body。一般用在数据通过POST请求或者PUT请求。它是HTTP请求中空行的后面那部分。(PS:这里涉及一个http常被问到的问题,http请求由哪几部分组成,一般是请求行,请求头,空行,请求体。payload body应该是对应请求体。)

一个请求伴随着header设置为Content-Type: application/json时,参数看起来是这样的:

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

如果你只是正常的请求一个ajax请求,浏览器是会把你提交的params作为Payload展示出来,因为他也不知道params来自哪里。

但如果你提交的请求设置了method="POST" 并且header设置了Content-Type: application/x-www-form-urlencoded或者Content-Type: multipart/form-data,那么你的请求看起来就是下面这样的,类似GET请求里的参数拼接:

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

这里的form data就是request payload,在这里浏览器知道的更多:他知道bar是表单foo的值Jack是name的值,所以这里做了展示。

在回到之前的问题,通过观察图片发现,两者的区别确实是因为header中Content Type的值设置不同导致的:

compare.png

通过查看request.js证实了这个验证:

http.png

解决办法:

在请求中,设置一个header即可

api.png

阅读 1.8k

javascript2
已有之事将来必有,易行之事将来必行,太阳底下无新事

已有之事将来必有,易行之事将来必行,太阳底下无新事。

23 声望
0 粉丝
0 条评论

已有之事将来必有,易行之事将来必行,太阳底下无新事。

23 声望
0 粉丝
文章目录
宣传栏