CSS 未应用于单独的 ejs 文件

Question

所以我试图弄清楚为什么我的CSS文件无法加载到我的一个ejs文件中。我已经确保我已正确添加标题并制作了一个测试页面，并仅使用标题/导航栏和 CSS 加载正常地呈现它。

我唯一能想到的是blog.ejs文件在我的app.js文件中呈现的方式。这是一个博客项目，所以我使用路由参数在自己的页面上渲染每个帖子。

请参阅以下适用于我的应用的代码.js

//jshint esversion:6
const express = require("express");
const bodyParser = require("body-parser");
const mongoose = require("mongoose");
const ejs = require("ejs");
const _ = require("lodash");
const app = express();
const startTitle ="Best";
const startContent="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.";
app.use(express.static("public"));
app.set("view engine", "ejs");
app.use(bodyParser.urlencoded({extended: true}));

let blogs = [];
app.get("/", function (req, res){
res.render("home",{
startTitle: startTitle,
startContent: startContent,
blogs:blogs
});
});
app.get("/compose", function (req, res){
res.render("compose");
});

app.get("/blogs/:blogId", function (req, res) {
const requestedTitle = _.lowerCase(req.params.blogId);
blogs.forEach(function(blog){
const storedTitle = _.lowerCase(blog.postedTitle);
if(requestedTitle === storedTitle){
res.render("blog",{
title: blog.postedTitle,
content: blog.postedContent
});
}
});

});

app.post("/compose", function (req, res){
const blog = {
postedTitle: req.body.title,
postedContent: req.body.content
};
blogs.push(blog);
res.redirect("/");
});

app.listen(3000, function(req, res){
console.log("server started on port 3000");
});

Answer 1

这听起来像是指向CSS文件的链接不是以/开头的。 如果它只是一个普通的相对 URL，在路径的开头没有http://或未/，则浏览器会在请求样式表之前将网页的路径添加到链接的 URL。 当网页具有前导路径(例如来自/blogs/blogID等页面(时，这将导致浏览器请求不同的页面，而您的服务器不会期望这样做。

因此，请确保所有样式表链接都以/开头，以便无论主机网页上的路径如何，您都可以获得对服务器的一致请求。