使用Node.js将动态表单多图片批量存储到MongoDB Atlas的方案咨询

1 调整Mongoose Schema #

我们需要把单行结构封装为数组项，支持存储任意数量的表单行数据，修改后的Schema代码如下：

var mongoose = require('mongoose');

// 单行数据的子Schema，对应表单每一行的结构
var rowSchema = new mongoose.Schema({
    name: String,
    desc: String,
    img: {
        data: Buffer,
        contentType: String
    }
});

// 主Schema，存储整个表单的所有行数据
var formSchema = new mongoose.Schema({
    // 可按需添加表单级公共字段，比如提交时间、提交人ID等
    submitTime: {
        type: Date,
        default: Date.now
    },
    rows: [rowSchema] // 所有表单行数据都存在这个数组里
});

module.exports = mongoose.model('FormData', formSchema);

2 前端表单字段格式要求 #

新增行时，所有字段的name属性要设置为数组格式，才能让后端按顺序拿到所有行的对应数据：

• 名称输入框：name="name[]"
• 描述输入框：name="desc[]"
• 图片上传框：name="image[]"

3 调整后端上传接口 #

将单文件上传改为多文件上传，按顺序组装每行数据后存入数据库：

// 引入修改后的Model，路径按需调整
const formModel = require('./schema/formData');

// 把原来的upload.single('image')改成upload.array，第二个参数为最大支持的上传行数，可按需调整
app.post('/', upload.array('image', 10), async (req, res, next) => {
    try {
        // 先校验数据长度是否一致，避免行数据不匹配
        const nameList = req.body.name || [];
        const descList = req.body.desc || [];
        const imgList = req.files || [];
        if (nameList.length !== descList.length || nameList.length !== imgList.length) {
            return res.status(400).send('所有行的字段都需要填写完整');
        }

        // 组装行数据
        const rows = nameList.map((name, index) => {
            const imgFile = imgList[index];
            return {
                name: name,
                desc: descList[index],
                img: {
                    data: fs.readFileSync(path.join(__dirname + '/uploads/' + imgFile.filename)),
                    contentType: imgFile.mimetype // 用上传文件的实际类型，避免写死png导致格式不兼容
                }
            }
        });

        // 存入数据库
        await formModel.create({ rows: rows });
        res.redirect('/');
    } catch (err) {
        console.log(err);
        res.status(500).send('存储失败');
    }
});

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