原文地址： 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>

　　如下图所示

　　

　　

  1. 如果请求头里设置Content-Type: application/x-www-form-urlencoded，那么这个请求被认为是表单请求，参数出现在Form Data里，格式为key=value&key=value&key=value...。后端可以通过request.getParameter(name)的形式来获取表单参数。

  2. 原生的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 区别？的更多相关文章

  1. Http请求中POST与GET的区别——前端面试

    一.原理区别 Http定义了与服务器交互的方法,其中最基本的四种是:GET,POST,PUT,DELETE,正对应着对资源的查,改,增,删.URL的全称是资源描述符,我们可以这样认为,一个URL地址, ...

  2. HTTP请求中GET和POST的区别

    一.原理区别 一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中,可以通过设置Method指定提交方式为GET或者POST提交方式,默认为GET提交方式. HTTP定义了与服务器交互 ...

  3. HTTP请求中POST与GET的区别

      本文章已收录于:   一.原理区别 一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中,可以通过设置Method指定提交方式为GET或者POST提交方式,默认为GET提交方式. ...

  4. JavaWEB HTTP请求中POST与GET的区别

    From 的get 和post方法.在数据传输过程中分别对应了HTTP协议中的GET和POST方法. 二者主要区别: GET从服务其获取数据;POST上传数据. GET将表单中的数据按照variabl ...

  5. Servlet中Request的getAttribute getParameter 区别

    1.从更深的层次考虑,request.getParameter()方法传递的数据,会从Web客户端传到Web服务器端,代表HTTP请求数据. request.getParameter()方法返回Str ...

  6. vue post 请求 是 request payload 而不是 FromData ，以及 格式转换成 FromData 需要的 key value 格式

    export function 方法名字(传进来要给后端的参数){     return request({         url : ' 后端提供的接口路径  ',         method  ...

  7. python request Payload 数据处理

    普通的http的post请求的请求content-type类型是:Content-Type:text/html; charset=UTF-8, 而另外一种形式request payload,其Cont ...

  8. 浅谈HTTP中Get与Post的区别_转

    可参考:HTTP请求中POST与GET的区别 Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE.URL全称是资源描述符,我们可以这样认为:一个UR ...

  9. 【转】HTTP请求中的form data和request payload的区别

    jQuery的ajax方法和post方法分别发送请求,在后台Servlet进行处理时结果是不一样的,比如用$.ajax方法发送请求时(data参数是一个JSON.stringify()处理后的字符串, ...

随机推荐

  1. element-ui <el-input> 注册blur事件

    <template> <div class="demo"> <el-input placeholder="注册blur事件" v- ...

  2. FileReader字符的读出

    1.fileReader是字符的读出,只能读文件. 2.在读取文件的之前,该文件必须存在. 3.int reader();一次读取一个字符,返回的该字符的码值,如果想要返回字符,直接进行强转char ...

  3. RabbitMQ环境安装及入门

    1. 说明 在企业应用系统领域,会面对不同系统之间的通信.集成与整合,尤其当面临异构系统时,这种分布式的调用与通信变得越发重要.其次,系统中一般会有很多对实时性要求不高的但是执行起来比较较耗时的地方, ...

  4. jQuery抽奖插件 jQueryRotate

    实现代码 网页中引用 <script type="text/javascript" src="js/jquery.min.js"></scri ...

  5. CSS Basic Memo

    1.bootstrap 清除浮动原理 .clearfix:before, .clearfix:after { content: ' ', display: table } .clearfix:afte ...

  6. .net core WebApi Mutex实现并发同步

    Mutex,中文译为互斥体,在.net中也是作为一种线程或进程之间的互斥体存在.即在同一时刻,一个共享资源只允许被某一个线程或进程访问,其他线程或进程需要等待(直至获取互斥锁为止). Mutex的使用 ...

  7. leetcode python 007

    ##  翻转整数def evert(int0):    if int0<0:        flg=1    else:        flg=0    e=int(str(int0)[flg: ...

  8. redis缓存工具类

    import org.springframework.beans.factory.annotation.Autowired; import org.springframework.data.redis ...

  9. 学习Java的第一天

    登录http://www.oracle.com,下载JDK(J2SE)JDK 1.0,1.1,1.2,1.3,1.4 1.5 (JDK5.0) 支持注解.支持泛型 1.6(JDK6.0) Servel ...

  10. 5.使用std的迭代器访问并修改图像

    void Test_ColorReduceByIterator() { Mat g_srcImage=imread("D:\\OpenCV Projects\\OpenCV_Test_Ima ...