使用Jade和NodeJS插入图片

Question

我该如何在图片中使用已通过Jade传递的对象？我还使用了MongoDB来存储数据。

目前这是我的代码：

db.collection('blogposts', function(err, collection) {
    if (err) throw err;
    collection.find().toArray(function(err, docs) {
        if (err) throw err;
        res.render('table', { title: 'Blog Posts', tab: "list" , blogposts: docs });
    });
});

所以我有一个通过mongodb集合传递到jade的nodejs， 然后在Jade中我有：

div.span9
    table.table.table-bordered.table-striped.noborder

        each row in blogposts
            tr
                td
                    div.blogtitle #{row.Title}
                    br
                    div.blogheading #{row.Heading}
                    br
                    div.namedate #{row.Namedate}
                    br
                    div.imagetable
                        img(src='')
                    br
                    div.blogposts #{row.Posts}
                    br
                    div.blogtags Tags: #{row.Tags}

我正在尝试的是在实际的)标签中使用#{row.Image}作为源。看起来我必须使用其他语法或某些东西才能在源中使用它，因为仅仅把它放进去是行不通的。

- brent

Answer 1

只需执行 img(src= "http://" + row.Image)

Jade将把src属性值视为JavaScript表达式，对其进行评估并呈现HTML，正如您所期望的那样。

- Peter Lyons

---

谢谢，现在已经接受了变量，但是图像源基于链接（即http://www.something.com/picture.jpg）。问题在于，即使我传递的变量周围有引号（也就是说，它显示为“http://www.something.com/picture.jpg”），它仍然无法识别它是外部链接，并希望从本地主机获取图像。我想知道如何让它认识到它正在从网站中获取图像？ - brent

抱歉，我忘了提到，它已经有了http://，我要发送给Jade的完整内容是"http://www.something.com/picutre.jpg"。 - brent

在调整引号后，它似乎现在可以工作了，感谢你的帮助。 - brent

Answer 2

如果您发送的是链接，它可能按照详细说明的方式工作。如果您将数据作为base64编码的字符串发送，则必须在图片数据前面添加以下内容：

"data:image/png;base64,"

因此，您将拥有：img（src =“data:image/png;base64,”+ row.ImageDataBase64）

- Greg S

Answer 3

我遇到了类似的问题。我的URL已经添加了https://前缀。解决方法如下：

img(src=row.Image)

- kjonsson