HTTP请求中 request payload 和 formData 区别?
原文地址: http://www.cnblogs.com/tugenhua0707/p/8975615.html
FormData和Payload是浏览器传输给接口的两种格式,这两种方式浏览器是通过Content-Type来进行区分的(了解Content-Type),如果是 application/x-www-form-urlencoded的话,则为formdata方式,如果是application/json或multipart/form-data的话,则为 request payload的方式。
比如如下使用ajax方式的提交post请求的代码(默认使用application/x-www-form-urlencoded编码):
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
<script type="text/javascript" src="https://tugenhua0707.github.io/html5UploadImage/js/jquery.js"></script>
</head>
<body>
<div id="app">
<div class="btn">发送post请求</div>
</div>
<script>
var obj = {
"name": 'CntChen',
"info": 'Front-End',
};
$('.btn').click(function() {
$.ajax({
url: 'www.example.com',
type: 'POST',
dataType: 'json',
data: obj,
success: function(d) { }
})
});
</script>
</body>
</html>
如下图所示:

2. 使用 multipart/form-data表单上传文件
如下html代码:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
</head>
<body>
<div id="app">
<form action="http://www.example.com" method="POST" enctype="multipart/form-data">
<p>username: <input type="text" name="fname" /></p>
<p>age: <input type="text" name="age" /></p>
<input type="submit" value="提交" />
</form>
</div>
</body>
</html>
如下图所示:

可以看到 使用multipart/form-data表单上传文件时使用的是 Request Payload 格式;
3. 使用 Content-Type: application/json 来编码
如下html代码:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
<script type="text/javascript" src="https://tugenhua0707.github.io/html5UploadImage/js/jquery.js"></script>
</head>
<body>
<div id="app">
<div class="btn">发送post请求</div>
</div> <script>
$('.btn').click(function() {
$.ajax({
url: 'http://localhost:8081/api.json',
type: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify({a: [{b:1, a:1}]}),
success: function(d) { }
})
});
</script>
</body>
</html>
如下图所示
如果请求头里设置Content-Type: application/x-www-form-urlencoded,那么这个请求被认为是表单请求,参数出现在Form Data里,格式为key=value&key=value&key=value...。后端可以通过request.getParameter(name)的形式来获取表单参数。
原生的AJAX请求头里设置Content-Type:application/json,或者使用默认的请求头Content-Type:text/plain;参数会显示在Request payload块里提交。
后端可以通过request.getParameter(name)的形式来获取表单参数。
private String getStringFromStream(HttpServletRequest req) {
ServletInputStream is;
try {
is = req.getInputStream();
int nRead = 1;
int nTotalRead = 0;
byte[] bytes = new byte[10240];
while (nRead > 0) {
nRead = is.read(bytes, nTotalRead, bytes.length - nTotalRead);
if (nRead > 0)
nTotalRead = nTotalRead + nRead;
}
String str = new String(bytes, 0, nTotalRead, "utf-8");
return str;
} catch (IOException e) {
e.printStackTrace();
return "";
}
}
HTTP请求中 request payload 和 formData 区别?的更多相关文章
- Http请求中POST与GET的区别——前端面试
一.原理区别 Http定义了与服务器交互的方法,其中最基本的四种是:GET,POST,PUT,DELETE,正对应着对资源的查,改,增,删.URL的全称是资源描述符,我们可以这样认为,一个URL地址, ...
- HTTP请求中GET和POST的区别
一.原理区别 一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中,可以通过设置Method指定提交方式为GET或者POST提交方式,默认为GET提交方式. HTTP定义了与服务器交互 ...
- HTTP请求中POST与GET的区别
本文章已收录于: 一.原理区别 一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中,可以通过设置Method指定提交方式为GET或者POST提交方式,默认为GET提交方式. ...
- JavaWEB HTTP请求中POST与GET的区别
From 的get 和post方法.在数据传输过程中分别对应了HTTP协议中的GET和POST方法. 二者主要区别: GET从服务其获取数据;POST上传数据. GET将表单中的数据按照variabl ...
- Servlet中Request的getAttribute getParameter 区别
1.从更深的层次考虑,request.getParameter()方法传递的数据,会从Web客户端传到Web服务器端,代表HTTP请求数据. request.getParameter()方法返回Str ...
- vue post 请求 是 request payload 而不是 FromData ,以及 格式转换成 FromData 需要的 key value 格式
export function 方法名字(传进来要给后端的参数){ return request({ url : ' 后端提供的接口路径 ', method ...
- python request Payload 数据处理
普通的http的post请求的请求content-type类型是:Content-Type:text/html; charset=UTF-8, 而另外一种形式request payload,其Cont ...
- 浅谈HTTP中Get与Post的区别_转
可参考:HTTP请求中POST与GET的区别 Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE.URL全称是资源描述符,我们可以这样认为:一个UR ...
- 【转】HTTP请求中的form data和request payload的区别
jQuery的ajax方法和post方法分别发送请求,在后台Servlet进行处理时结果是不一样的,比如用$.ajax方法发送请求时(data参数是一个JSON.stringify()处理后的字符串, ...
随机推荐
- K-临近算法(KNN)
K-临近算法(KNN) K nearest neighbour 1.k-近邻算法原理 简单地说,K-近邻算法采用测量不同特征值之间的距离方法进行分类. 优点:精度高.对异常值不敏感.无数据输入假定. ...
- Grafana + Prometheus 监控PostgreSQL
效果图 部署环境 服务器名称 IP地址 部署业务 备注 部署agent sht-sgmhadoopcm-01 172.16.101.54 PostgreSQL 监控服务器.被监控服务器 node_ex ...
- NodeJS中使用swig模板引擎
NodeJS中的默认引擎是jade有点过于复杂,而且不是以HTML为基础的,学习成本和前端适应成本都很大.而ejs虽然简单,但不支持模板导入,而且效率一般. swig的语法简单,学习成本很低,符合常规 ...
- 跟随我在oracle学习php(4)
制作html表单 客户端(每个用户的计算机)在浏览网页时,都会向服务器(后台)端索要数据,然后将得 到的数据呈现在浏览器当中.除了索要数据之外,有时客户端也希望能够向服务器端发送 一些数据. 这时我们 ...
- PHP 第三方支付
以前事情比较繁忙,压根都没有时间去整理最近的工作. 最近稍微轻松点,就把自己在公司处理的支付业务拿出来,留个纪念,顺道回顾下以前自己支付的知识. 俗话说实践是检验整理的唯一标准,东西做的是否能用,只能 ...
- word转换成HTML 以及IE不兼容问题
public static bool WordToHtml(string wordFileName, string htmlFileName) { try { Object oMissing = Sy ...
- wav文件格式分析与详解
WAV文件是在PC机平台上很常见的.最经典的多媒体音频文件,最早于1991年8月出现在Windows 3.1操作系统上,文件扩展名为WAV,是WaveFom的简写,也称为波形文件,可直接存储声音波形, ...
- SpringBoot的学习【3.HelloWorld配置细节】
/** * @SpringBootApplication用来标注主程序类. */ @SpringBootApplication public class First { public static v ...
- Open Nginx gzip
默认情况下,Nginx的gzip压缩是关闭的, gzip压缩功能就是可以让你节省不少带宽,但是会增加服务器CPU的开销哦,Nginx默认只对text/html进行压缩 ,如果要对html之外的内容进行 ...
- 【leetcode】448. Find All Numbers Disappeared in an Array
problem 448. Find All Numbers Disappeared in an Array solution: class Solution { public: vector<i ...