使用 express 和 EJS 动态显示图像答案

【问题标题】：Display dynamically an image using express and EJS使用 express 和 EJS 动态显示图像
【发布时间】：2015-09-06 22:44:57
【问题描述】：

我有一个包含不同 URL 图像的集合。我检索了我想要的 URL，并希望将其传递给玉模板，例如：

app.get('/',function(req,res){
    mongoDB.getUsedHomePageOne(function(err, result){
        if(!err){
            console.log("getUsedHomePageOne : ");
            console.log(result);
            app.locals['homePageImg'] = result.url;
        }
    });

    app.render('userPageEjs.html',function(err,renderedData){
        console.log(renderedData);
        res.send(renderedData);
    });
});

getUsedHomePageOne 看起来像：

DBMongo.prototype.getUsedHomePageOne  = function(callback){
    this.homePageColl.findOne({used:1}, callback);
};

在翡翠模板中：

<img src="<%= homePageImg %>"/>

因此，除非我加载两次页面，否则这将不起作用，我认为是因为它被缓存并且计算速度足够快或其他什么。

正确的做法是什么？

PS：我第二次加载页面，一切都会正确加载。

PS2：我不想延迟图像的渲染，我想在图像准备好后加载，但无论如何都要先渲染 HTML 页面。

【问题讨论】：

这不是 Jade 模板，而是 EJS 模板。
是的，我改了标签但没改标题，感谢指点
你的意思是它不起作用？图像是否加载？您能否进一步扩展刷新问题？
将app.render() 函数放在getUsedHomePageOne() 回调中。
看看我的 PS2，我知道我可以这样做，但我想渲染页面，然后在图像准备好时加载。

标签： node.js express ejs

【解决方案1】：

根据我在您的代码中收集到的内容：

app.get('/',function(req,res){
    mongoDB.getUsedHomePageOne(function(err, result){
        if(!err){
            console.log("getUsedHomePageOne : ");
            console.log(result);
            app.locals['homePageImg'] = result.url;
            app.render('userPageEjs.html',function(err,renderedData){
               console.log(renderedData);
               res.send(renderedData);
            });
        }
    });
});

基本上，您对 DB 有一个异步函数，您可以在等待 DB 函数完成之前快速渲染模板。使用异步函数时的正常模式，其结果应该被使用，你必须在异步函数中调用下一个函数。但是，这可能会导致回调地狱（类似于我在上面编写修复程序的方式），因此通常首选诸如 Promises 或 async.js 之类的替代方案。

【讨论】：