常见的POST提交方式

HTTP 协议是基于TCP/IP协议之上的应用层规范，规范将 HTTP 请求分为三部分： 请求行、请求头、消息体。整体类似于：

<method> <request-URL> <version>   // 请求行

<headers>  // 请求头

<entity-body>  // 协议体

协议规定 POST 请求的参数必须放在协议体中，但我们在请求头中设置消息主体的协议格式。服务端通常是根据请求头（headers）中的 Content-Type 字段来获知请求中的消息主体是用何种方式编码，再对主体进行解析。所以说到 POST 提交数据方案，包含了 Content-Type 和消息主体编码方式两部分。下面就正式开始介绍它们。

 

一、application/x-www-form-urlencoded

---

常见的 POST 请求提交方式，请求头类似于

大部分服务器端都对这种提交方式有很好的支持，例如 JQuery 和 QWrap 的 Ajax，Content-Type 默认值都是「application/x-www-form-urlencoded;charset=utf-8」。

 

二、multipart/form-data

---

通常上传文件需要将 Content-Type 设为 multipart/form-data。前端使用 formData对象来加入文件

var form = new FormData();
form.append('iid', '2');
form.append('test', '2');
form.append('file', cfg.Obj, cfg.Name);

 

三、application/json

---

application/json 这个 Content-Type 作为响应头大家肯定不陌生。实际上，现在越来越多的人把它作为请求头，用来告诉服务端消息主体是序列化后的 JSON 字符串。由于 JSON 规范的流行，除了低版本 IE 之外的各大浏览器都原生支持 JSON.stringify，服务端语言也都有处理 JSON 的函数，使用 JSON 不会遇上什么麻烦。

JSON 格式支持比键值对复杂得多的结构化数据，这可以让我们直接传递 JSON 对象给服务器。axios 中的 post 方法就是默认使用 application/json 方式提交的。

var infoForm = {
    'u': xxxxxx
}
this.$post('xxxxxxx/gettest', infoForm)
    .then((response) => {
        ....
    })
    .catch(function (error) {
         console.log(error);
    });

 

四、text/xml

---

text/xml 是一种使用 HTTP 作为传输协议，XML 作为编码方式的远程调用规范。典型的 XML-RPC 请求是这样的：

POST http://www.example.com

HTTP/1.1 Content-Type: text/xml

<?xml version="1.0"?>

<methodCall>

     <methodName>examples.getStateName</methodName>

     <params> <param>

     <value><i4>41</i4></value>

</param> </params> </methodCall>

但 text/xml 过于臃肿，一般场景使用 JSON 会更加灵活