React+Node使用Nodemailer时请求体数据无法传递的问题

问题根源 #

导致请求体为空的核心原因有两个：

1. 前端发送JSON数据时未声明Content-Type请求头，后端无法识别请求体格式
2. 后端未配置JSON解析中间件，无法解析前端发送的JSON数据

修复步骤 #

1. 前端添加请求头声明 #

在fetch请求中添加headers字段，明确告知后端请求体为JSON格式：

fetch('/api/sendmail', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json', // 新增该请求头
    },
    body: JSON.stringify(this.state)
}).then(function(response) {
    console.log(response)
    return response.json();
});

2. 后端配置JSON解析中间件 #

在你的Node/Express应用中，必须添加express.json()中间件才能解析JSON格式的请求体，将这行代码放在所有路由定义之前：

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

// 新增这行，放在路由配置前
app.use(express.json());

// 后续的nodemailer配置和路由...
const nodemailer = require("nodemailer")
// ... 你的其他代码

3. 修正后端日志输出 #

你当前代码中console.log(res)是打印响应对象，应改为打印请求体用于调试：

app.post("/api/sendmail", (req, res) => {
    console.log(req.body); // 改为打印req.body而非res
    const {message} = req.body;
    // ... 其余代码
})

验证修改 #

完成上述修改后重启前后端服务：

• 前端提交表单后，后端控制台会正确打印包含message字段的请求体
• Nodemailer可正常获取message内容并发送邮件

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