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

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


2456523150-60531bd471dbe_fix732.png

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


3526521755-60531be7aa60b_fix732.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的值设置不同导致的:


2057617657-60531c0cd3d0b_fix732.png

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


2820148121-60531c24acc84_fix732.png

解决办法:

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


3656953970-60531c33aef35_fix732.png
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容