node.js - res.render(template)时使用node和express服务get(/foo/:bar) requests,，template中所有相对链接都是相对于/foo而不是/

Question

我的 Node 服务器代码中的违规路由是这样的:

app.get('/s/:searchTerm', function(req, res) {
  res.render('index');
});

发生这种情况后，index.jade中的所有相对链接都是相对于“hostname/s/”而不是“hostname/”，这是损坏的。

我的 Node 设置如下所示:

app.set('view engine', 'jade');
app.set('views', __dirname + '/views');

app.use(express.static(__dirname + '/public/'));
app.use(express.favicon(__dirname + '/public/img/favicon.ico'));

app.use(express.json());
app.use(app.router);

除/s/:searchTerm 路由外，所有这些路由均有效。甚至/results 路线也有效。正如我所期望的那样，partials/result 中的相对链接是相对于“主机名”的。

app.get('/', function(req, res) {
  res.render('index');
});

app.get('/s/:searchTerm', function(req, res) {
  res.render('index');
});

app.get('/results', function(req, res) {
  res.render('partials/results');
});

index.jade 只是引用layout.jade:

extends layout

layout.jade 的开头是这样的:

!!! 5
html(lang='en' data-ng-app='FooApp')
  head
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(name='viewport', content='width=device-width, initial-scale=1.0')
    meta(name='author', content='foo@gmail.com`')
    link(rel='shortcut icon', href='img/favicon.ico')
    title FooApp.com â„¢
    // Bootstrap core CSS 
    link(href='//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css', rel='stylesheet')
    // Custom css for this template 
    link(href='css/style.css', rel='stylesheet')
    //if lt IE 9
      script(src='https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js')
      script(src='https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js')
  body(data-ng-controller='SearchController'
    .navbar.navbar-inverse.navbar-fixed-top(role='navigation')
    .container
      .navbar-header
        button.navbar-toggle(type='button' data-target='.navbar-collapse'

如何呈现部分内容并保留该部分中相对于“主机名”的链接？

编辑:添加了index.jade和layout.jade代码

编辑:啊，我发现我对图标做了一些多余的事情。

Answer 1

您所看到的行为是预期的，因为 href 是相对于加载它们的页面的。由于您的 /a/:searchTerm 路由嵌套在 /a 中，因此像 img/favicon.ico 这样的静态资源的 href 将选取它们的相对路径父路线。如果您希望 href 在公共(public)目录的根目录中查找静态资源，请在 href 前面添加 /，如下所示:/img/favicon。 ico