客户端使用AJAX $.post向MongoDB插入数据仅生成ID无内容如何解决？

1. 修复后端缺失的请求体解析配置 #

Express 默认不会自动解析 POST 请求的请求体，你没有配置对应中间件的情况下req.body默认是空对象，所以插入Mongo的数据只有自动生成的_id。在server.js的app.post路由定义之前添加以下代码：

// 解析application/json格式的请求体
app.use(express.json());
// 解析application/x-www-form-urlencoded格式的请求体（$.post默认使用该格式）
app.use(express.urlencoded({ extended: true }));

如果你用的是4.16版本以下的旧Express，需要单独安装body-parser包引入使用。

2. 验证前端提交的数据有效性 #

在客户端调用$.post前添加打印逻辑，确认从localStorage取值正常：

localData = localStorage.getItem('localData');
console.log('待提交的localData值：', localData);

打开调试工具控制台如果输出为空/NULL，说明你之前存储localStorage的逻辑有问题，优先修复存数据的部分。

3. 修复后端无响应返回的问题 #

你当前的接口逻辑在数据插入完成后没有给前端返回任何内容，前端回调拿到的是未定义的响应对象，直接转字符串就会显示[object Object]。调整接口逻辑如下：

app.post('/postData', (req, res) => {
  // 新增打印确认后端收到的请求内容
  console.log('收到的请求体：', req.body);
  currCollection.insertOne(req.body, function(err,result){
    if(err) {
      console.log(err);
      // 返回错误响应
      return res.status(500).send({msg: '插入失败', error: err});
    } else {
       console.log("Data inserted: "+result);
       // 返回成功响应，带插入内容方便前端校验
       return res.send({msg: '插入成功', insertedData: req.body});
    }
  })
});

前端如果要查看完整返回内容，可以把alert语句改成alert(JSON.stringify(data))即可正常展示内容。

4. Cordova环境额外配置 #

如果你是打包成APP在手机端运行，请求localhost:3000无法联通，需要把请求地址改成后端服务所在的局域网IP（比如http://192.168.x.x:3000/postData），同时在Cordova的config.xml里配置跨域权限：

<access origin="*" />
<allow-navigation href="*" />
<allow-intent href="*" />

生产环境请把通配符替换成你实际的后端域名，缩小权限范围。

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