POST请求数据格式四种常见的请求格式 1.application/x-www-form-urlencoded Cont

四种常见的请求格式

1.application/x-www-form-urlencoded

Content-Type默认值是 [ application/x-www-form-urlencoded;charset=utf-8 ]

提交的数据格式是key1=val1&key2=val2

【qs库示例】

import qs from 'qs'
const str1 = 'name=zhangsan&age=21'
console.log(qs.parse(str1))   // { name: 'zhangsan', age: "21" }

const json1 = { name: 'zhangsan', age: "21" }
console.log(qs.stringify(json1))   //'name=zhangsan&age=21'

qs.stringify({ a: ['b', 'c', 'd'] });  // 'a[0]=b&a[1]=c&a[2]=d'
qs.stringify({ a: ['b', 'c', 'd'] }, { indices: false });    // 'a=b&a=c&a=d'

qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })   // 'a[0]=b&a[1]=c'--保留索引值
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })  // 'a[]=b&a[]=c'--只保留括号
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })    //  'a=b&a=c'--不显示索引信息

有关Content-Type的总结：

2.multipart/form-data

一般用来上传文件，使用原生form表单上传文件时，需要将enctype属性值设置为multipart/form-data

这里说下原生form表单与formData的使用

form表单元素是浏览器原生支持的dom元素，formData是HTML5新增的API,IE10开始兼容。

form表单可以用来提交数据或上传文件，但是原生的Form表单提交有个问题就是，上传文件之后无法接收后台返回的数据。解决这个问题可以用XHR发送请求＋ FormData封装数据解决

获取form表单
let formData=new FormData(form)

 //监听form表单的submit事件
 let req=new XMLHttpRequest();
 req.open('POST','url',true)
 req.onload=function(event){ 
     if(req.status===200){ 
   }else{ 
   }
 }
 req.send(formData)
 //再阻止form表单的默认submit事件

3.application/json

将json数据进行JSON.stringify之后，进行传输，后台解析数据更方便一点。

4.text/xml