CSS 未應用於單獨的 ejs 文件

Question

所以我想弄清楚為什么我的 CSS 文件不會加載到我的一個 ejs 文件中。 我確保我已經正確添加了 header 並制作了一個測試頁面並僅使用標題/導航欄呈現它，並且 CSS 加載正常。

我唯一能想到的是 blog.ejs 文件在我的 app.js 文件中呈現的方式。 這是一個博客項目，所以我使用路由參數在自己的頁面上渲染每個帖子。

請參閱下面的代碼了解我的 app.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 文件的鏈接不以/開頭。 If it's just a plain relative URL with no http:// or not / at the start of the path, then the browser will add the path from the web page to your linked URL before requesting the style sheet. 當 web 頁面具有諸如/blogs/blogID之類的頁面的前導路徑時，這將導致瀏覽器請求不同的頁面，並且您的服務器不會期望這樣。

因此，請確保您的所有樣式表鏈接都以/開頭，因此無論主機 web 頁面上的路徑是什么，您都會收到對服務器的一致請求。