如何通过AJAX Post请求将JSON对象传递至Node.js服务器API？

阿华AIGC实验室

2026-5-20

实现AJAX POST传递JSON到Node.js后端并完成接收处理

没问题，我来帮你把前后端的JSON传递流程补全并修正细节，确保数据能正确传递和接收：

一、前端AJAX代码修正

你当前的AJAX请求有个关键细节需要调整：当contentType设置为application/json时，jQuery不会自动把JavaScript对象转为JSON字符串，必须手动处理才能让后端正确解析。修改后的代码如下：

$.ajax({ 
  type:"POST", 
  dataType:"json", 
  contentType: "application/json", 
  // 核心修正：把JavaScript对象转为标准JSON字符串
  data: JSON.stringify(newWorkLog), 
  url:"/add", 
}) 
.done(function(response){ 
  console.log("Response of update: ", response) 
}) 
.fail(function(xhr, textStatus, errorThrown){ 
  console.log("ERROR: ", xhr.responseText) 
  return xhr.responseText; 
});

修正说明：

指定contentType: "application/json"后，后端会严格按照JSON格式解析请求体，因此必须用JSON.stringify()将newWorkLog对象转为JSON字符串，否则后端会因为格式不匹配无法解析数据。

二、Node.js后端完整实现

你已经正确配置了body-parser.json()中间件，这是解析JSON请求体的关键。接下来补全完整的路由处理逻辑：

var express = require('express');
var bodyParser = require('body-parser'); 
var app = express();

// 保持你已配置的JSON解析中间件
app.use(bodyParser.json());

// 完整的POST路由处理逻辑
app.post('/add', function(req, res) {
  // 通过req.body直接获取前端传递的JSON数据
  const receivedWorkLog = req.body;
  
  // 这里添加你的业务逻辑：比如数据校验、存入数据库等
  console.log('接收到的工作日志数据：', receivedWorkLog);
  
  // 给前端返回JSON格式的响应
  res.status(200).json({
    success: true,
    message: '数据接收成功',
    receivedData: receivedWorkLog
  });
});

// 启动服务器（示例端口为3000，可根据你的需求修改）
app.listen(3000, function() {
  console.log('服务器运行在http://localhost:3000');
});

后端关键说明：

body-parser.json()会自动识别Content-Type: application/json的请求，解析后的JSON数据会挂载到req.body上，直接调用即可。
确保路由路径/add和前端AJAX的url完全一致，避免出现404错误。
处理完业务逻辑后，用res.json()返回JSON格式的响应，和前端dataType: "json"的配置匹配，确保前端能正确解析响应。