Question

我正在使用快递和车把。问题是具有类似http://localhost:5000/api/posts的url的页面不包含css文件。但是，像http://localhost:5000或http://localhost:5000/register这样的路由器也可以正常工作。

app
-server.js
-routes
  -api
    -posts.js
-public
  -css
  -images
-views
  -layout
    -main.handlebars
  -posts.handlebars

在server.js中。（仅重要部分）

app.engine('handlebars', exphbs());
app.set('view engine', 'handlebars');
app.use(express.static(path.join(__dirname, 'public')));

app.get('/', (req, res) => res.render('index'));
app.get('/register', (req, res) => res.render('register'));

app.use('/api/posts', require('./routes/api/posts'));

由于我确实在server.js中包括了app.use(express.static(path.join(__dirname, 'public')));，所以我认为静态文件应该没有任何问题。

但是，在main.handlebars <link rel="stylesheet" href="css/main.css">中不起作用。另一方面，<link rel="stylesheet" href="../css/main.css">确实有效。此外，如果我将app.use('/api/posts', require('./routes/api/posts'));更改为app.use('/posts', require('./routes/api/posts'));也可以，如果我不想在这里更改路线，还有其他方法可以解决此问题吗？

不包括css时的错误是Refused to apply style from 'http://localhost:5000/api/css/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.，但是，我不知道如何使public成为默认路径。因为我已经包含app.use(express.static(path.join(__dirname, 'public')));，所以可以使用静态文件。

Answer 1

对于您的CSS文件，请使用href="/css/main.css"。您正在使用的是相对路径，请在浏览器调试中检查“网络”选项卡。它将加载http://localhost:5000/api/css/main.css而不是http://localhost:5000/css/main.css。

顺便说一句，如果您想构建一个RESTful api，我认为它不应该响应一个CSS文件。

如何在Express中包含用于api路由器的css文件？

1 个答案: