Question

所以我对此很陌生，但是我认为这应该可以解决。

我使用Raspberry Pi 3和Node.js创建一个网站来控制GPIO。我用HTML编写了网站。

现在，我想要一个图像作为网站上各开关背后的背景。如果我通过url链接图片（例如Google的图片），就没问题。

但是，如果我链接Pi上的图片，则该图片不会显示在网站上。它显示文件名，但不显示它。我将图像放在与html文件相同的文件夹中。

这是我制作的html代码：

<html>
<head>
<body>

<h1>Control LED light</h1>

<img src="Winkraftanlage.png" alt="Windkraftanlage">
</body>
</head>

<body>
<input id="light" type="checkbox">LED
</body>

```</html>


Thanks a lot in advance.

Answer 1

为什么不使用express处理所有静态文件，并使用ejs模板处理前端将express.js导入到您的app.js

var express = require('express');
var app = express();
Now let node know the path of the public folder :
var publicDir = require('path').join(__dirname,'/public');
app.use(express.static(publicDir));

__ dirname为您提供当前目录（在本例中为app.js所在的根目录）

例如，每当访问这样的URL时，现在节点就会从上述目录中提供静态文件。

http://localhost/myapp/public/imgs/myImage.jpg

只需将适当的URL放在前端的src中，就像这样：

将您的index.html重命名为index.ejs

在您的app.js中

app.set('view engine', 'ejs');

最后运行npm install

并像这样粘贴您的图像：

<img src="public/imgs/Winkraftanlage.png" alt="Windkraftanlage"">

Node.js服务器上的HTML网站不显示图像

1 个答案: