ExpressJS：POST请求与外部JS函数使用异常问题排查

嘿，我看你在搭建带后端功能的网页时，POST请求这块出了问题——咱们先揪出核心问题，再一步步解决：

首先是客户端的关键错误 #

XMLHttpRequest的send()方法只能接收一个参数，你直接写httpRequest.send(var1,var2,var3,var4)是完全不符合规范的，浏览器只会忽略后面的参数，根本不会把这四个变量的数据正确发送给服务端。

你需要把多个参数打包成服务端能识别的格式，常用的有两种，选一种就行：

方案1：发送表单格式数据（适合传统表单场景） #

修改客户端代码：

// 初始化请求
const httpRequest = new XMLHttpRequest();
httpRequest.open('POST', '/test2');

// 必须设置请求头，告诉服务端这是表单编码的数据
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

// 把参数打包成key=value&key2=value2的格式，注意用encodeURIComponent处理特殊字符
const formData = `var1=${encodeURIComponent(var1)}&var2=${encodeURIComponent(var2)}&var3=${encodeURIComponent(var3)}&var4=${encodeURIComponent(var4)}`;

// 发送打包好的数据
httpRequest.send(formData);

方案2：发送JSON格式数据（适合前后端分离的API场景） #

修改客户端代码：

const httpRequest = new XMLHttpRequest();
httpRequest.open('POST', '/test2');

// 设置请求头为JSON格式
httpRequest.setRequestHeader('Content-Type', 'application/json');

// 把参数转成JSON字符串
const jsonData = JSON.stringify({ var1, var2, var3, var4 });

httpRequest.send(jsonData);

然后是服务端的配置要跟上 #

你用了body-parser，但得确保配置和客户端发送的格式对应上：

如果用方案1（表单格式） #

在你的Server.js里添加：

// 解析表单编码的请求体，extended: true支持复杂对象
app.use(bodyParser.urlencoded({ extended: true }));

如果用方案2（JSON格式） #

在Server.js里添加：

// 解析JSON格式的请求体
app.use(bodyParser.json());

最后在服务端路由里获取参数 #

不管用哪种格式，只要配置正确，你都可以通过req.body拿到参数：

app.post('/test2', (req, res) => {
  // 打印接收到的参数，方便调试
  console.log('接收到的参数：', req.body);
  
  // 直接用req.body.var1、req.body.var2...获取对应值
  const { var1, var2, var3, var4 } = req.body;
  
  // 这里写你的业务逻辑，比如调用dbFunc处理数据
  dbFunc.someFunction(var1, var2, var3, var4)
    .then(result => res.send('处理成功'))
    .catch(err => res.status(500).send('处理失败：' + err));
});

额外调试小技巧 #

1. 打开浏览器开发者工具的「Network」面板，找到/test2的请求，查看「Payload」标签，确认数据有没有正确发送
2. 服务端打印req.body，如果是空的，大概率是请求头和body-parser配置不匹配
3. 确保你的路由是app.post('/test2', ...)，别写成GET了

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