使用XMLHttpRequest发JSON请求时Express POST接口无法接收数据求助

问题排查与解决步骤 #

1. 前端请求发送逻辑修正 #

你当前在调用XHR.send()时直接传入了JavaScript原生对象，XMLHttpRequest不会自动将对象序列化为JSON字符串，即便你配置了Content-Type: application/json请求头也不会自动做序列化处理。
需要修改sendData函数：

function sendData(data) {
  const XHR = new XMLHttpRequest();
  XHR.open("POST", window.location.href);
  XHR.setRequestHeader("Content-Type", "application/json");
  console.log(data); // 可正常输出正确数据
  XHR.send(JSON.stringify(data)); // 新增JSON序列化
}

2. 后端Express配置修正 #

Express默认不会解析请求体中的JSON格式数据，你需要在主服务文件（通常是app.js/index.js）中注册内置的JSON解析中间件，且必须在注册路由之前配置：

const express = require('express');
const app = express();

// 新增这一行，开启JSON请求体解析
app.use(express.json());

// 之后再注册你的路由
app.use(router);

额外注意事项 #

• 路由路径需要完全匹配，你前端请求地址为当前页面路径，要确保和后端定义的router.post('/:id/settings')规则匹配
• 后端处理完请求后需要返回响应，比如添加res.sendStatus(200)，否则前端请求会超时

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