无法在哈巴狗上显示图像答案

【问题标题】：cant show image on pug无法在哈巴狗上显示图像
【发布时间】：2017-06-30 18:01:08
【问题描述】：

这是我的代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Home Page</title>
</head>
<body>
<img src="resources/mainlogo.png" style="width:304px;height:228px;">
<h1>Welcome to our user management application</h1>
<h3>Please see links below to navigate our homepage</h3>

<a href = /adduser>Create new user</a>
<a href = /users>List users</a>

</body>
</html>

所有除了图片都会显示

这是我的文件结构：

index.html
resources
  mainlogo.png

我做错了什么？

这是渲染代码

app.get('/', function (req, res) {

    // render main page
    res.sendFile(__dirname + "/index.html");


});

这也是来自控制台的错误

Error http://localhost:8000/resources/mainlogo.png 404 (Not Found)

尽管图片在资源文件夹中。

【问题讨论】：

我想我正在感知可能出现的问题。也许我需要单独实现 get 来发送图像？

标签： javascript html css node.js express

【解决方案1】：

添加这个

app.use(express.static('resources'))

并改变它

<img src="mainlogo.png" style="width:304px;height:228px;">

帮助

【讨论】：

哎呀！当你这样做时，我就添加了我的答案。在资源下有一个名为 img 的文件夹可能会更好，以便更好地组织您的文件。

【解决方案2】：

您需要通过express.static 访问资源文件夹。这应该可以解决问题：

app.use(express.static('resources')); //This will allow express to access any file in that folder

HTML：

...
<img src="mainlogo.png" style="width:304px;height:228px;">
...

【讨论】：

【解决方案3】：

您需要使用express.static 中间件来提供静态文件，例如图片和 CSS 文件。

在你的情况下，这应该工作：

app.use(express.static('resources'));

查看displaying static files 的静态文档

【讨论】：