axios 加 body-better-router 或者 koa-body-router 记录
熊俊人
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div id='wf'>fef</div>
</body>
<script>
let wf = document.querySelector('#wf')
/**
axios.post('http://localhost:3002/workers/test',{
name:'wi',
interest:["ball","women"],
age:25,
idNum:'3303292',
contentinfo:'我是一个'
},{
transformRequest: [function (data) {
// Do whatever you want to transform the data 不做转换 是下面那样子
// 做了转换提交的数据 name=wi&interest=ball%2Cwomen&age=25&idNum=3303292&contentinfo=%E6%88%91%E6%98%AF%E4%B8%80%E4%B8%AA&
返回 ：fields:{name: "wi", interest: "ball,women", age: "25", idNum: "3303292", contentinfo: "我是一个"}
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
// 必不可少，修改数据的提交方式 不做转换提交的数据 {"name":"wi","interest":["ball","women"],"age":25,"idNum":"3303292","contentinfo":"我是一个"}
返回 ：fields:{' {"name":"wi","interest":["ball","women"],"age":25,"idNum":"3303292","contentinfo":"我是一个"}':''}
headers : {
"Content-Type":'application/x-www-form-urlencoded; charset=UTF-8'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
*/
//正常是json 很正常
// {"name":"wi","interest":["ball","women"],"age":25,"idNum":"3303292","contentinfo":"我是一个"}
// fields:{name: "wi", interest: ["ball", "women"], age: 25, idNum: "3303292", contentinfo: "我是一个"}
// axios.post('http://localhost:3002/workers/test',{
// name:'wi',
// interest:["ball","women"],
// age:25,
// idNum:'3303292',
// contentinfo:'我是一个'
// })
// .then(function (response) {
// console.log(response);
// })
// .catch(function (error) {
// console.log(error);
// });
//正常是json 很正常
/* formdata 的方式
let formd=new FormData()
formd.append('name','wi')
formd.append('interest',["ball","women"])
formd.append('age',25)
formd.append('idNum','3303292')
formd.append('contentinfo','我是一个')
------WebKitFormBoundary6QIF0YdAlfUAt5SV
Content-Disposition: form-data; name="name"
wi
------WebKitFormBoundary6QIF0YdAlfUAt5SV
Content-Disposition: form-data; name="interest"
ball,women
------WebKitFormBoundary6QIF0YdAlfUAt5SV
Content-Disposition: form-data; name="age"
25
------WebKitFormBoundary6QIF0YdAlfUAt5SV
Content-Disposition: form-data; name="idNum"
3303292
------WebKitFormBoundary6QIF0YdAlfUAt5SV
Content-Disposition: form-data; name="contentinfo"
我是一个
------WebKitFormBoundary6QIF0YdAlfUAt5SV--
返回的：fields:{name: "wi", interest: "ball,women", age: "25", idNum: "3303292", contentinfo: "我是一个"}
axios.post('http://localhost:3002/workers/test',formd,{
headers : {
"Content-Type":'application/json; charset=UTF-8'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
********************************
一下 koa-body-parser
*/
/*
常规：json
axios.post('http://localhost:3002/workers/test',{
name:'wi',
interest:["ball","women"],
age:25,
idNum:'3303292',
contentinfo:'我是一个'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
/*
request payload
发出：
{"name":"wi","interest":["ball","women"],"age":25,"idNum":"3303292","contentinfo":"我是一个"}
返回：
body:{name: "wi", interest: ["ball", "women"], age: 25, idNum: "3303292", contentinfo: "我是一个"}
*/
/*
// 常规：formdata
let formd=new FormData()
formd.append('name','wi')
formd.append('interest',["ball","women"])
formd.append('age',25)
formd.append('idNum','3303292')
formd.append('contentinfo','我是一个')
axios.post('http://localhost:3002/workers/test',formd)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
request payload
发出：
------WebKitFormBoundaryP6a61UJDJIdu1LxN
Content-Disposition: form-data; name="name"
wi
------WebKitFormBoundaryP6a61UJDJIdu1LxN
Content-Disposition: form-data; name="interest"
ball,women
------WebKitFormBoundaryP6a61UJDJIdu1LxN
Content-Disposition: form-data; name="age"
25
------WebKitFormBoundaryP6a61UJDJIdu1LxN
Content-Disposition: form-data; name="idNum"
3303292
------WebKitFormBoundaryP6a61UJDJIdu1LxN
Content-Disposition: form-data; name="contentinfo"
我是一个
------WebKitFormBoundaryP6a61UJDJIdu1LxN--
返回：
body:{}
*/
// 常规：urlcode 转换
/* axios.post('http://localhost:3002/workers/test', {
name: 'wi',
interest: ["ball", "women"],
age: 25,
idNum: '3303292',
contentinfo: '我是一个'
}, {
transformRequest: [function (data) {
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
headers: {
"Content-Type": 'application/x-www-form-urlencoded; charset=UTF-8'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
*/
// form data
// 发出：
// name=wi&interest=ball%2Cwomen&age=25&idNum=3303292&contentinfo=%E6%88%91%E6%98%AF%E4%B8%80%E4%B8%AA&
// 返回：
// body:{name: "wi", interest: "ball,women", age: "25", idNum: "3303292", contentinfo: "我是一个"}
//urlcode 不转换
axios.post('http://localhost:3002/workers/test', {
name: 'wi',
interest: ["ball", "women"],
age: 25,
idNum: '3303292',
contentinfo: '我是一个'
}, {
headers: {
"Content-Type": 'application/x-www-form-urlencoded; charset=UTF-8'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
// form data
// 发出：
// {"name":"wi","interest":["ball","women"],"age":25,"idNum":"3303292","contentinfo":"我是一个"}
// 返回：
//body:{{"name":"wi","interest":: {"ball","women": ""}}
</script>
</html>
类似资料：