Express+Mongoose路由执行顺序问题：异步查询致渲染数据缺失

嘿，我完全懂你碰到的这个坑——这是异步操作时序问题导致的！你遍历foo.bars调用Baz.find的时候，这些查询都是异步执行的，但你没等所有异步请求完成就直接渲染页面了，所以EJS拿到的foo.bars还没来得及加上data字段，自然就显示不出来啦。

问题根源拆解 #

你原来的代码大概是这样的（我猜的）：

app.get('/foo/:id', async (req, res) => {
  const foo = await Foo.findById(req.params.id);
  if (req.isAuthenticated()) {
    // forEach里的async函数是异步执行的，不会阻塞后续代码
    foo.bars.forEach(async (bar) => {
      const bazData = await Baz.find({ barId: bar._id, userId: req.user._id });
      bar.data = bazData;
    });
  }
  // 这里的res.render会先于上面的所有Baz.find执行完成
  res.render('foo', { foo });
});

forEach里的异步回调并不会阻塞res.render的执行，所以页面渲染时，bar.data还没被赋值，视图自然拿不到数据。

正确的解决方法：用Promise.all等待所有异步操作完成 #

我们需要把每个Baz.find的操作包装成Promise，然后用Promise.all等待所有Promise都完成后，再去渲染页面。具体代码如下：

app.get('/foo/:id', async (req, res) => {
  try {
    // 先拿到foo数据
    const foo = await Foo.findById(req.params.id);
    if (req.isAuthenticated()) {
      // 把每个bar的查询任务转成Promise，存入数组
      const updatedBars = await Promise.all(
        foo.bars.map(async (bar) => {
          // 注意：如果bar是Mongoose文档对象，要转成普通JS对象才能自由添加属性
          const barObj = bar.toObject();
          // 执行专属数据查询
          const userSpecificData = await Baz.find({ 
            barId: barObj._id, 
            userId: req.user._id 
          });
          // 添加data字段
          barObj.data = userSpecificData;
          return barObj;
        })
      );
      // 替换原foo的bars数组为更新后的数组
      foo.bars = updatedBars;
    }
    // 现在所有异步查询都完成了，再渲染页面
    res.render('foo', { foo });
  } catch (error) {
    // 别忘了处理错误
    console.error('查询或渲染出错：', error);
    res.status(500).send('服务器内部错误');
  }
});

关键注意点 #

1. 用map代替forEach：forEach无法收集异步操作的Promise，而map可以返回一个Promise数组，供Promise.all处理。
2. Mongoose文档转普通对象：如果bar是Mongoose的Document实例，直接添加data字段可能不会生效（因为Mongoose有自己的属性管理机制），所以要用bar.toObject()转成普通JavaScript对象后再修改。
3. 错误处理：一定要用try/catch包裹所有异步操作，避免因为某个查询出错导致服务器崩溃。

这样修改后，所有的Baz.find操作都会在页面渲染前完成，foo.bars里的每个bar都会带上data字段，EJS页面就能正常拿到数据啦！

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