点击删除按钮在Node.js中删除服务器图片及MySQL表中图片名称

要同时删除MySQL中的图片记录和服务器上的对应图片，需要在后端先获取图片路径，再删除文件，最后删除数据库记录。以下是具体修改方案：

步骤1：引入Node.js文件处理模块 #

在app.js顶部添加内置的fs和path模块，用于处理文件删除和路径拼接：

const fs = require('fs');
const path = require('path');

步骤2：新增数据库查询方法 #

在你的数据库服务模块（比如dbService.js）中，添加根据ID查询图片路径的方法，用于获取要删除的图片在服务器上的文件名/路径：

// dbService.js
getImagePathById(id) {
    return new Promise((resolve, reject) => {
        // 替换成你的表名和图片字段名，比如`img`是你存储图片名称的字段
        const query = 'SELECT img FROM your_table WHERE id = ?';
        this.db.query(query, [id], (err, results) => {
            if (err) reject(err);
            resolve(results[0] || null);
        });
    });
}

步骤3：修改后端删除路由 #

更新app.js中的/delete/:id路由，先查询图片路径，删除服务器文件，再删除数据库记录：

app.delete('/delete/:id', async (request, response) => {
    const { id } = request.params;
    const db = dbService.getDbServiceInstance();

    try {
        // 1. 查询对应图片的路径/文件名
        const imageRecord = await db.getImagePathById(id);
        if (imageRecord && imageRecord.img) {
            // 2. 拼接服务器上图片的绝对路径，假设图片存放在项目根目录的`uploads`文件夹下
            const imagePath = path.join(__dirname, 'uploads', imageRecord.img);
            
            // 3. 删除服务器上的图片文件（先判断文件是否存在，避免报错）
            if (fs.existsSync(imagePath)) {
                fs.unlinkSync(imagePath);
            }
        }

        // 4. 删除数据库中的记录
        const deleteResult = await db.deleteRowById(id);
        response.json({ success: deleteResult });
    } catch (err) {
        console.error('删除失败:', err);
        response.json({ success: false, error: err.message });
    }
});

步骤4：前端代码无需修改 #

你的index.js代码保持原样即可，因为前端只需要传递记录ID，所有文件删除逻辑都在后端完成。

注意事项 #

• 确保uploads文件夹的路径正确，根据你实际存储图片的位置调整path.join的参数
• 若担心同步方法阻塞事件循环，可改用异步的fs.unlink并配合await
• 可根据业务需求调整逻辑：比如文件删除失败时，是否继续删除数据库记录

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