Form表单提交的四种数据格式

9,765 阅读1分钟

便于展示,使用superagent库. 表单提交只是POST请求的一种方式.`

application/json

application/json格式在AJAX或者FetchPOST请求里面可以说是最常见的一种格式. 但是Form表单提交上W3CHTML5对表单提交的格式已经做了说明

也就是说新版本浏览器上不支持application/json格式的表单提交. 老版本还能用. 我们看下它的数据格式吧

request.post("/simu/wechat/voucherList")
    .set('Content-Type', 'application/json')
    .send({
        name:"leiwuyi",
        age:12
    }).then(res => {

    })

application/x-www-form-urlencoded

这首表单提交的默认格式,不支持文件类型.它的请求格式是键值对.

request.post("/simu/wechat/voucherList")
            .set('Content-Type', 'application/x-www-form-urlencoded')
            .send('name=tj')
            .send('pet=tobi')
            .then(res => {
            })

multipart/form-data

表单提交文件必须要用这种格式,注意不能设置'Content-Type'='multipart/form-data'. 因为你手动设置了它,那么后面这个boundary=浏览器默认boundary就没了。这个是分界线,服务端是以这个分界线去key值.如果没有分界线服务端就不知道从从哪个位置开始取key`

let form = new FormData();
        form.append("name", "leiwuyi");
        form.append("age", 12);
        request.post("/simu/wechat/voucherList")
            //.set('Content-Type', 'multipart/form-data')
            .send(form)
            .then(res => {
            })

text/plain

text/plain是以纯文本格式(就是一段字符串)发送的. 如果你发送一个对象例如{ name:"leiwuyi", age:12 }一定要对它做JSON.stringfiy()处理,否则将传送[object Object]

request.post("/simu/wechat/voucherList")
    .set('Content-Type', 'text/plain')
    .send("age=12")
    .then(res => {
})

有问题大家及时指正,非常感谢!