javascript - express.static 仅加载到 index.html

Question

我正在尝试获取公用文件夹中的静态文件(图像、js、css)以供我的所有路由使用。我只能将它们加载到 index.html。 management.html 文件无法访问静态文件，我在 Chrome 控制台上收到 404 错误。

文件夹结构:

-app/  
---index.html
---management.html
---public/
------css/
------js/
------img/

服务器.js:

const express = require('express');
const path = require('path');

var app = express();

app.use(express.static(path.join(__dirname, 'public')));

app.get('/', function(req, res) {
    res.sendFile('index.html', {root: __dirname })
});

app.get('/management', function(req, res) {
    res.sendFile('management.html', {root: __dirname })
});

app.listen(3000);

Answer 1

在您的 HTML 文件中，您可能指的是静态文件的相对路径。例如:<img src="img/example.png"> .此链接将基于您当前的位置。

当你的当前位置是http://example.com/ (index.html)，那么它将引用http://example.com/img/example.png ，文件可能所在的位置。

但是当你的位置是http://example.com/management (management.html)，它指的是http://example.com/management/img/example.png ，这将返回 404。

使用这个文件的绝对路径就可以解决这个问题。您可以通过放置一个 / 来做到这一点相对路径前面:<img src="/img/example.png"> .或者，您可以在 management.html 中使用相对路径像这样:<img src="../img/example.png"> .