请求体编码
默认情况下,axios将 JavaScript 对象序列化为 JSON
。 要以application/x-www-form-urlencoded
格式发送数据,您可以使用以下选项之一。
浏览器
在浏览器中,可以使用URLSearchParams
API,如下所示:
const params = new URLSearchParams()
params.append('param1', 'value1')
params.append('param2', 'value2')
axios.post('/foo', params)
或者, 您可以使用 qs
库编码数据:
const qs = require('qs')
axios.post('/foo', qs.stringify({ 'bar': 123 }))
或者用另一种方式 (ES6),
import qs from 'qs'
const data = { 'bar': 123 }
const options = {
method: 'POST',
headers: { 'content-type': 'application/x-www-form-urlencoded' },
data: qs.stringify(data),
url
}
axios(options)
Node.js
Query string
在 node.js 中, 可以使用 querystring
模块,如下所示:
const querystring = require('querystring')
axios.post('http://something.com/', querystring.stringify({ foo: 'bar' }))
或者从 url module
中使用 URLSearchParams
,如下所示:
const url = require('url')
const params = new url.URLSearchParams({ foo: 'bar' })
axios.post('http://something.com/', params.toString())
您也可以使用 qs
库。
如果需要对嵌套对象进行字符串化处理,则最好使用
qs
库,因为 querystring
方法在该用例中存在已知问题(https://github.com/nodejs/node-v0.x-archive/issues/1665)。Form data
在 node.js, 您可以使用 form-data
库,如下所示:
const FormData = require('form-data')
const form = new FormData()
form.append('my_field', 'my value')
form.append('my_buffer', new Buffer(10))
form.append('my_file', fs.createReadStream('/foo/bar.jpg'))
axios.post('https://example.com', form, { headers: form.getHeaders() })
或者, 使用一个拦截器:
axios.interceptors.request.use(config => {
if (config.data instanceof FormData) {
Object.assign(config.headers, config.data.getHeaders())
}
return config
})
🆕 自动序列化
当请求头中的 content-type
是 application/x-www-form-urlencoded
时,Axios 将自动地将普通对象序列化成 urlencoded 的格式。
在浏览器和 node.js
环境中都适用:
const data = {
x: 1,
arr: [1, 2, 3],
arr2: [1, [2], 3],
users: [{ name: 'Peter', surname: 'Griffin' }, { name: 'Thomas', surname: 'Anderson' }]
}
await axios.post('https://postman-echo.com/post', data,
{ headers: { 'content-type': 'application/x-www-form-urlencoded' } }
)
服务器接收到的数据就像是这样:
{
x: '1',
'arr[]': [
'1',
'2',
'3'
],
'arr2[0]': '1',
'arr2[1][0]': '2',
'arr2[2]': '3',
'arr3[]': [
'1',
'2',
'3'
],
'users[0][name]': 'Peter',
'users[0][surname]': 'griffin',
'users[1][name]': 'Thomas',
'users[1][surname]': 'Anderson'
}
如果您的服务器框架的请求体解析器(例如express.js
的body-parser
)支持嵌套对象解码,则其接收到的数据将与您提交的数据一样。
以下是一个express.js
的服务器示例,它将会把接收到的数据作为响应返回:
var app = express()
app.use(bodyParser.urlencoded({ extended: true })) // support url-encoded bodies
app.post('/', function (req, res, next) {
res.send(JSON.stringify(req.body))
})
server = app.listen(3000)