javascript - 在 express.js 中加载静态文件

Question

我使用 express 构建网络应用程序。我有路由或静态文件的问题。我添加了对静态文件的引用:

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

并设置路线:

app.use('/', routes);
app.use('/users', users);
app.use('/blog', blog);

在我的博客路由器中:

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res) {
  res.render('blog/index');
});
/* GET registration form. */
router.get('/registration', function(req, res) {
  res.render('blog/registration');
});

module.exports = router;

所以我的问题:当我转到 /blog 时，我的静态文件正确加载(路径中没有博客)。但是当我转到 /blog/registration 时出现错误(路径中有博客):

GET /blog/stylesheets/css/bootstrap.min.css  registration:1
GET /blog/stylesheets/lib/og-component.css  registration:1
GET /blog/stylesheets/lib/venobox.css  registration:1
GET /blog/stylesheets/lib/zocial.css  registration:1
GET /blog/stylesheets/lib/font-awesome.css  registration:1
GET /blog/stylesheets/lib/animate.css  registration:1
GET /blog/stylesheets/css/style.css  registration:1
GET /blog/stylesheets/css/scheme/light-blue.css  registration:1
GET /blog/js/lib/modernizr.custom.js  registration:1
GET /blog/images/jssolutions-logo.png 404 (Not Found) 

如何解决这个问题:加载路径中没有 blog 的静态文件:

/stylesheets/css/bootstrap.min.css

Answer 1

这与 express 或 static 无关，但更多与您如何从网页引用静态文件有关。具体来说，如果您的网址看起来像

<link href="stylesheets/stylesheet.css" rel="stylesheet" />

然后这些被假定为相对于当前的 URL 根。例如，如果当前 URL 是 /blog，那么根是 /，因此脚本是从 /stylesheets/stylesheet.css 加载的。所以在你的场景中，如果 URL 是 /blog/registration，那么根是 /blog/ 因此脚本是从 /blog/stylesheets/stylesheet 加载的.css.

如果希望所有静态文件都从网站根目录加载，则在开头放置一个正斜杠

<link href="/stylesheets/stylesheet.css" rel="stylesheet" />