使用Postman、Node.js+Express传图片与JSON参数时请求体为空

我正在为大学项目开发基于Node.js和Express的多平台在线票务商城RESTful API，已完成Event和Image模型的创建，并编写了事件添加接口addEvent，但使用Postman测试时始终获取到空的req.body，尝试过多种参数输入格式都无法解决问题。

已实现的模型代码 #

Event 模型 #

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

const eventSchema = new Schema({
    event_name: {
        type: String,
        required: true
    },
    event_description: {
        type: String,
        required: true
    },
    event_date: {
        type: Date,
        required: true
    },
    event_coordinates: {
        type: String,
        required: true
    },
    event_ticket_price: {
        type: Number,
        required: true
    }, 
    event_images: [{
        type: String
    }]
});

module.exports = mongoose.model('Event', eventSchema);

Image 模型 #

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

const imageSchema = new Schema({
    associated_event: {
        type: String,
        required: true
    },
    name: String,
    data: {
        type: Buffer,
        required: true
    }
});

module.exports = mongoose.model('Image',  imageSchema);

事件控制器中的addEvent函数 #

const addEvent = async (req, res) => {
    console.log(req.body);
    const { name, description, date, coordinates, ticket_price, images } = req.body;
    const files = req.files;

    if (!name || !description || !date || !coordinates || !ticket_price) {
        return res.status(400).json({ 'message': 'Event\'s name, description, date, coordinates and ticket_price' });
    }

    const foundEvent = await Events.findOne({ event_name: name }).exec();
    if (foundEvent) return res.sendStatus(409);

    if(files){
        const imagesArray = await imagesController.storeImages(files, name);
        console.log(imagesArray);
    }

    try {
        await Events.create({
            "event_name": name,
            "event_description": description,
            "event_date": date,
            "event_coordinates": coordinates,
            "event_ticket_price": ticket_price,
           // "event_images": imagesArray
        });

        res.status(201).json({ 'success': `New event ${name} created!` });
    } catch (err) {
        res.status(500).json({ "message": err.message });
    }
}

解决方法 #

核心问题是文件上传场景下的中间件配置缺失，按以下步骤修复：

• 配置multer中间件处理文件上传
  因为接口需要同时接收普通字段和文件，必须使用multer来解析表单数据，否则req.body和req.files都会为空。安装并配置：

  npm install multer
  

  在路由文件中引入并使用：

  const multer = require('multer');
  const upload = multer({ dest: './uploads' }); // 指定文件临时存储路径
  const eventsController = require('../controllers/eventsController');
  
  // 挂载中间件，指定文件字段名为images（对应Postman中的文件字段名）
  router.post('/events', upload.array('images'), eventsController.addEvent);
  

• Postman请求格式检查

  • 请求类型选择form-data，不要用raw(JSON)格式；
  • 普通字段的键要和代码中解构的name、description、date等完全一致；
  • 文件字段名设置为images（和multer配置的upload.array('images')一致），并选择要上传的文件。

• 避免重复解析中间件冲突
  不要在该路由上同时使用express.json()或express.urlencoded()，multer会自动解析form-data格式的请求体，重复配置会导致请求体为空。

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