无法使用快速路由提供静态文件，也不能使用尾部斜杠

Question

我想要一条名为'main'的路线，它将提供静态文件：

app.use('/main',express.static(__dirname+'/public'));

然而，当我这样做时：

http://my.site.dev/main

CSS和JS文件不会下载，因为它试图从

获取它们

http://my.site.dev/css/styles.css

应该从以下文件获取文件：

http://my.site.dev/main/css/styles.css

但是，如果我使用尾部斜杠访问我的网站：

http://my.site.dev/main/

所有文件都很好

为什么不使用尾随斜杠的任何想法会混淆CSS和JS之类的资源？

Answer 1

这是一个http问题，而不仅仅是与Express相关的挑战。问题在以下讨论：

• Relative URLs and trailing slashes
• http://www.bizcoder.com/the-mystery-of-the-trailing-slash-and-the-relative-url

如果您的网址是/ main且您的相对网址是css / style.css，则会解析为/css/style.css;但如果您的网址是/ main /，则相对网址会解析为/main/css/style.css。

我处理此问题的策略是重定向以添加尾部斜杠。在Express中像这样：

app.all(/^\/main$/, function(req, res) { res.redirect('/main/'); });
app.use('/main/',express.static(__dirname+'/public'));

或者：

app.enable('strict routing');
app.all('/main', function(req, res) { res.redirect('/main/'); });
app.use('/main/',express.static(__dirname+'/public'));

Answer 2

HTML中如何请求JS / CSS文件？如果您使用的是css/styles.css之类的字符串，那么它会尝试从当前目录中获取它们。 /main的目录是/（就像/main.html一样），而/main/的目录是/main/。快速解决方法是在HTML中使用/main/css/styles.css。