url中有参数时Express stylesheet 404错误答案

【问题标题】：Express stylesheet 404 error when there is a parameter in the urlurl中有参数时Express stylesheet 404错误
【发布时间】：2014-07-30 17:06:55
【问题描述】：

在本地主机上使用 express 3.5.1 我的 app.js 文件中有

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

我的 style.css 文件在 public/stylesheets 中

在我的 page.jade 文件中

doctype html
html
    head
        link(rel = "stylesheet" href = "stylesheets/style.css")
    body
        // more stuff here

最后，在我的路线中，我有

app.get('/path', dostuff);
app.get('/path/:param', dostuff);

function dostuff(req,res) {
    res.render('page');
}

现在，当我转到 localhost:3000/path 时，一切都很好，并且包含 style.css。但是我转到 localhost:3000/path/anything，页面仍然呈现，但是我碰巧包含的任何样式表都会出现 404 错误，即使功能完全相同。为什么会这样？是否有人四处寻找似乎无法找到此特定案例的答案。

【问题讨论】：

标签： css node.js express parameters pug

【解决方案1】：

您的样式表 href 是相对的，并且浏览器看到对 /path/anything 的请求，因此它会将 /stylesheets/style.css 添加到末尾。浏览器不知道这是同一个页面，anything 只是一个重写的查询参数。

两种可能的解决方案：

使用绝对路径。如果您在 Express 4 中使用嵌套路由器，您现在实际上可以获得当前路由器的基本路径。如果您仍然希望样式表相对于任何路径，这可以帮助您构建样式表的路径。
使用实际的查询参数，例如/path?param=anything。

【讨论】：

使用了第二种方法。奇迹般有效！万分感谢！干杯! :)

【解决方案2】：

对于http://localhost:3000/path/foo，浏览器使用http://localhost:3000/path作为基本URL，所以它试图请求http://localhost:3000/path/stylesheets/style.css，因为stylesheets/style.css是一个相对链接。使用 / 前缀将其转换为绝对链接...

link(rel = "stylesheet" href = "/stylesheets/style.css")

【讨论】：

噢！当我查看控制台时，我应该注意到这一点。感谢您的快速答复。
遇到了同样的问题，它与您的解决方案配合得很好。谢谢！
这是正确的解决方案。