使用express和EJS动态显示图像

时间:2015-06-21 10:57:07

标签: node.js express ejs

我有一个包含不同图片网址的集合。我检索到我想要的URL,并希望将其传递给jade模板,如:

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页面。

1 个答案:

答案 0 :(得分: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);
            });
        }
    });
});

基本上,您具有数据库的异步功能,并且在等待数据库功能完成之前快速呈现模板。使用异常函数时的正常模式,其结果应该在行中使用,你必须在异步函数内调用下一个函数。但是,这可能导致回调地狱(类似于我上面写的修复方式),因此通常首选Promises或async.js之类的替代方案。