ReactJS中POST JSON数据仅生成ID，其他字段未提交问题求助

嘿，我一眼就看出问题出在哪啦！你现在的代码里直接把JavaScript对象传给xhr.send()，但XMLHttpRequest不会自动帮你把对象转换成JSON格式，而且你也没告诉后端你发送的是JSON数据，所以后端没法正确解析你提交的字段，自然就只有默认生成的ID，其他数据都没存进去。

问题的核心原因： #

• 没有设置Content-Type: application/json请求头，后端不知道要按JSON格式解析请求体
• 直接发送JavaScript对象，而不是JSON字符串，导致请求体格式不对

修改后的代码： #

var url = 'http://localhost:3000/applications'; //Configurable endpoint
var isSent = false;
var data = {
  name : this.state.name,
  age : this.state.age,
  prefix : this.state.prefix,
  email : this.state.email
}
var xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
// 关键1：设置请求头，告诉后端我们发送的是JSON格式
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function () {
  isSent = true;
  console.log(this.responseText);
};
// 关键2：把JavaScript对象转换成JSON字符串再发送
xhr.send(JSON.stringify(data));

额外小建议： #

• 可以加上xhr.onerror事件处理请求失败的情况，比如网络错误：

xhr.onerror = function() {
  console.error('请求发送失败');
  isSent = false;
};

• 如果你的项目里已经引入了axios这类HTTP库，用它们会比原生XMLHttpRequest更简洁，也不容易犯这类格式错误哦～

内容的提问来源于stack exchange，提问作者Przemo