Question

我正在为我的网页构建一个后端，其文件结构如下：

public
  css
    main.css
    main_b.css
  index.hbs
  index_b.hbs
server
  server.js

样式表在索引文件中由包含以下内容的链接属性引用：

rel =“ stylesheet” type =“ text / css” href =“ main.css”

rel =“ stylesheet” type =“ text / css” href =“ main_b.css”

这是我的server.js：

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

const express = require('express');

const app = express();

const hbs = require('hbs');

hbs.registerPartials(path.join(__dirname, '../public/partials'));
app.set('view engine', 'hbs');

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

// activity logger 
app.use((req, res, next) => {
  const now = new Date().toString();
  const logEntry = `${now}: ${req.headers.host} ${req.method}${req.url}`;
  fs.appendFile(path.join(__dirname, '../server/server.log'), logEntry.concat('\n'), (error) => {
    if (error) {
      console.log(error);
    }
  });
  process.env.route = req.path;
  next();
});

app.get('*', (req, res) => {
  switch (process.env.route) {
    case '/': // home page
      res.render('../public/index.hbs');
      break;
    case '/b': // basic layout 
      res.render('../public/index_b.hbs');
      break;

    default: // unknown routes
      res.render('../public/index.hbs');
  }
});

app.listen(3000);

在请求localhost：3000时，日志输入正常：

2019年1月24日星期四07:57:08 GMT + 0200（东欧标准时间）：localhost：3000 GET /

在请求localhost：3000 / abc时，日志输入也可以：

2019年1月24日星期四07:57:08 GMT + 0200（东欧标准时间）：localhost：3000 GET / abc

问题出现在使用localhost：3000 / abc / def之类的子路由测试请求时，css无法呈现，日志条目为：

2019年1月24日星期四08:04:55 GMT + 0200（东欧标准时间）：本地主机：3000 GET / abc / def 2019年1月24日星期四08:04:56 GMT + 0200（东欧标准时间）：本地主机：3000 GET / abc / teamk-reset.css 2019年1月24日星期四08:04:56 GMT + 0200（东欧标准时间）：localhost：3000 GET / abc / main.css

我看到路线的一部分用于修改CSS查找路径，并尝试通过在Express.static（）中对选项对象的索引和重定向属性来解决此问题，但没有成功。

很高兴收到一些指示/参考，否则，我应该重构我的路线查询方法。

Answer 1

我发现我的代码有问题，

样式表应该在索引文件中通过包含以下内容的链接属性进行引用：

rel =“ stylesheet” type =“ text / css” href =“ / main.css”

rel =“ stylesheet” type =“ text / css” href =“ / main_b.css”

，它们的名称以'/'开头，以正确构建查找URL。

在我的Node Express服务器上路由CSS的问题

1 个答案: