看下面一个例子

Node.js模拟接收

router.post('/api',(req, res) => {
	if( req.body.username ) {
		res.json({
			success: true
		})
		return;
	}
	res.json({
		success: false
	})
})

jQuery发送一个POST请求

$.post('/api', {username: 'xjh'}, function(res, textStatus, xhr) {
    // {success: true}
	console.log(res);
}, 'json')

同样的用axios发送一个POST请求

axios.post('/api', {
	username: 'xjh'
})
.then(res => {
    // {success: false}
	console.log(res.data);
})
.catch(e => e);

axios返回了响应信息为{success: false}, 说明后端没有接收到username的字段

遇到这种问题就烦，砸键盘的想法都有

接收不到的一个原因是因为jQuery处理的方式不一样，jQuery是使用Form Data去处理的，而axios是使用JSON的方式去处理

解决方法一

这种方式要玩好，URLSearchParams这个API浏览器支持还不够友好

axios.post('/api', {
	username: 'xjh',
    pwd: 123
}, {
	headers: {
        // 指定Content-Type
		'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
	},
    // 可以在这里将数据处理后发送
    // data参数就是发送的数据 {username: 'xjh', pwd: 123}
	transformRequest: [function (data) {
		var searchParams = new URLSearchParams();
		for(var x in data) {
			searchParams.append(x, data[x]);
		}
        // username=xjh&pwd=123
		return searchParams;
	}]
})
.then(res => {
	console.log(res.data);
})
.catch(e => e);

解决方法二

这种方法不用愁兼容性, 通过for in循环去拼接成字符串然后return出去

axios.post('/api', {
	username: 'xjh',
    pwd: 123
}, {
	headers: {
        // 指定Content-Type
		'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
	},
    // 可以在这里将数据处理后发送
	transformRequest: [function (data) {
		var params = ''
        for (var x in data) {
            params += encodeURIComponent(x) + '=' + encodeURIComponent(data[x]) + '&'
        }
        // username=xjh&pwd=123
        return params;
	}]
})
.then(res => {
	console.log(res.data);
})
.catch(e => e);

后端解决

是因为后端没有处理成JSON才会接收不到 Content-Type: 'application/json’请求

// 在Node.js里面接收JSON请求就好了, 这样的话前端就不需要处理了
app.use(bodyParser.json());