Question

如何将图像与html一起发送到node.js服务器上的页面？如何使用express static发送图像？（这里需要一个例子）

服务器端 - ＆gt;

app.get('/', function (req, res) {
    res.sendFile(__dirname + '/login.html');
});

app.post('/m', function (req, res) {

    res.sendFile(__dirname + '/m/a.png');
    res.sendFile(__dirname + '/m/b.png');
    res.sendFile(__dirname + '/m/c.png')
    res.sendFile(__dirname + '/m/d.html');
});

Answer 1

在Web服务器中，您不只是将多个图像发送到页面。相反，浏览器请求页面HTML，解析它，在HTML中查找<img>标记，然后分别请求每个图像，并且您的Web服务器通过发送请求的图像来响应每个单独的图像请求。

如果将所有图像放在公共文件夹中，则可以使用express.static()使用一行代码处理所有图像请求。例如，像这样的一行代码：

app.use("/image", express.static(path.join(__dirname, "public")));

将为此网址提供所有图片请求：

/image/a.png
/image/b.png

在a.png下面的“public”子目录中找到匹配的b.png和__dirname（这是脚本的目录）。您可以阅读有关express.static() here的更多信息。显然，您可以使用要使用的URL的路径以及找到图像的路径。这两个只需要一起工作，以便express.static()可以在您放置它的服务器硬盘驱动器上的相应位置找到正确的图像。

在理解app.use()和express.static()中的单独路径组件如何协同工作时，通常会有一些困惑。在上面的示例中，"/image"将成为请求网址的一部分，此app.use("/image", ...)表示您希望将此特定中间件应用于以/image开头的任何请求路径。

然后path.join(__dirname, "public")告诉express.static()在/image之后获取其余的网址路径，并在目录{{1}下方的子文件夹public中查找该路径}。因此，如果浏览器请求__dirname，/image/a.png语句将触发，因为app.use()匹配该网址，然后/image将尝试查找路径的剩余部分{{1在你告诉它查看的目录中。

在您的服务器硬盘上，这将如下所示：

express.static()

我在app.js所在的目录中显示了login.html，因为这就是你当前编写代码的方式。我个人不会将任何公共文件放在与我的服务器脚本相同的目录中，因为我希望它不容易出错并且不小心将我的服务器文件暴露给公众。

我通常会这样做：

a.png

或者，让/myproject/ app.js login.html /public a.png b.png也提供login.html文件。

node.js - 如何将多个图像发送到服务器上的页面

1 个答案: