如何通过页面按钮删除MongoDB文档数组中的指定消息？

要解决点击删除按钮仅删除对应消息的问题，需要从前端传递标识、后端正确操作MongoDB数组这两方面修改，具体步骤如下：

1. 确保消息有唯一标识（推荐） #

让MongoDB为Messages数组中的每个消息自动生成_id，修改后的文档结构示例：

{
  _id: new ObjectId("623rf3f22275f399f88bb"),
  first_name: 'Are',
  last_name: 'You',
  email: 'helping@stackoverflow.me',
  password: '$2a$10$BSmezAjYkqU.234t65sT1pPOhg5jxosYrFzwjqXM3On3v.b7p46K1WS',
  username: 'lcd1',
  Messages: [
    {
      _id: new ObjectId("msg1-id"),
      msgcontent: 'The user whatever said: whatsup.'
    },
    {
      _id: new ObjectId("msg2-id"),
      msgcontent: 'The user whatever said: whatsup.'
    }
    // ...其他消息
  ]
}

插入新消息时，MongoDB会自动为每个数组元素生成_id，无需手动添加。

2. 修改前端渲染代码 #

在表单中添加隐藏字段，传递用户ID和消息ID，让后端明确要删除哪个用户的哪条消息：

<% if (messages.length > 0) { %>
    <% for (let i = 0; i < messages.length; i++) { %>
        <div class="cardmsgpage">
            <div class="displaymsg">Message <%= i+1 %> : <%= messages[i].msgcontent %></div>
            <div class="sideways">
                <form action="/deletemsg" method="POST">
                    <!-- 隐藏字段传递用户ID和消息ID -->
                    <input type="hidden" name="userId" value="<%= user._id %>">
                    <input type="hidden" name="msgId" value="<%= messages[i]._id %>">
                    <button class="msgpagebtn" type="submit">
                        <img class="icon" src="/images/trash-can-solid.svg">
                    </button>
                </form>
            </div>
        </div>
    <% } %>
<% } %>

注：假设渲染页面时已传入当前用户对象user，若未传入，需从请求中获取登录用户的ID。

3. 修改后端POST请求处理代码 #

使用MongoDB的$pull操作符，从指定用户的Messages数组中移除对应ID的消息：

app.post('/deletemsg', async (req, res) => {
    const { userId, msgId } = req.body;
    try {
        // 更新用户文档，移除指定ID的消息
        await users.updateOne(
            { _id: userId },
            { $pull: { Messages: { _id: msgId } } }
        );
        // 删除完成后重定向回消息页面（替换为实际路由）
        res.redirect('/messages');
    } catch (err) {
        console.error('删除消息出错:', err);
        res.status(500).send('删除消息失败');
    }
});

替代方案（无消息ID时） #

如果暂时无法给消息添加_id，可以通过消息内容删除，但注意内容重复会删除所有匹配的消息：

• 前端隐藏字段改为传递消息内容：

  <input type="hidden" name="msgContent" value="<%= messages[i].msgcontent %>">
  

• 后端修改为按内容匹配：

  app.post('/deletemsg', async (req, res) => {
      const { userId, msgContent } = req.body;
      try {
          await users.updateOne(
              { _id: userId },
              { $pull: { Messages: { msgcontent: msgContent } } }
          );
          res.redirect('/messages');
      } catch (err) {
          console.error('删除消息出错:', err);
          res.status(500).send('删除消息失败');
      }
  });
  

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