ajax(chrome)数据提交的4种格式(Form Data, Request Payload)

 ajax POST提交的方式有4种

1. Content-Type: application/x-www-form-urlencoded
2. Content-Type: application/json
3. Content-Type: multipart/form-data 
4. Content-Type: text/plain

1. application/x-www-form-urlencoded

此种方式，

1.1 参数为 name=fa&&age=22, 则chrome中显示为

Form data
    name: li
    age: 22

1.2 参数为 {name:'fa',age:22}, 则chrome中显示为

Form data
    {"name":"fa","age":"22"}

jquery默认使用此种方式发送数据，传入的对象格式的参数也会自动格式化为第一种的字符串格式
axios默认采用application/json, 即使设定Content-Type: application/x-www-form-urlencoded，也不会自动
将传入的对象格式的参数格式化为字符串，会产生1.2形式的参数发送，需要手动进行格式化。
可以使用 Object.keys(obj).reduce((pre,cur) => pre + '&' + cur + '=' + obj[cur],'').slice(1)
或者使用 URLSearchParams (不用设置Content-Type，axios可以直接转为FormData)来处理。

2. Content-Type: application/json

2.1 参数格式 {name:'fa',age:22}, 则chrome中显示为

Request Payload
    {name: 'fa', age: 22}
        age: 22
        name: 'fa'        

Request Payload是json格式参数在chrome中的显示方式。

3. Content-Type: multipart/form-data

格式如下：

Content-Type: multipart/form-data; boundary=---------------------------314911788813839

-----------------------------314911788813839
Content-Disposition: form-data; name="foo"

bar
-----------------------------314911788813839
Content-Disposition: form-data; name="baz"

The first line.
The second line.

-----------------------------314911788813839--

FormData格式数据也可以换用Content-Type: multipart/form-data，格式会变成上面的样子。

4. Content-Type: text/plain

格式如下：

foo=bar
baz=The first line.
The second line.

 

参考:  https://www.cnblogs.com/ChengWuyi/p/7117060.html