Node JS用css提供html文件

Question

我正在练习纯粹的节点js，我已经惹恼了一个扰乱http protocole的事情。经过一个小时左右的搜索和测试我的代码，我终于用css服务了我的html页面。这是我的代码：

const server = http.createServer((req, res)=>{
if(req.url === "/"){
    fs.readFile("index.html", "UTF-8", function(err, data){
        res.writeHead(200, {"Content-Type": "text/html"});
        res.end(data);
    });
}else if(req.url === "/styles.css")){
    var cssPath = path.join(__dirname, 'public', req.url);
    var fileStream = fs.createReadStream(cssPath, "UTF-8");
    res.writeHead(200, {"Content-Type": "text/css"});
    fileStream.pipe(res);
};
});

但我不明白为什么它有效。好吧，我只在浏览器中输入“/”，我没有输入“/styles.css”。为什么我在URL栏中看不到“/styles.css”。我确定这是因为http protocole的设计方式，但你可以帮助解释一下这个protocole。先感谢您。

Answer 1

如果您在地址栏中键入了/styles.css，那么您将看到CSS文件的源代码。例如：this link。

您键入/，然后浏览器要求服务器/，服务器响应HTML文档。

然后浏览器呈现HTML文档。我认为，HTML文档包括以下内容：

<link rel=stylesheet href=/styles.css>

因此，浏览器向服务器请求/styles.css，服务器响应CSS文件。然后，浏览器将该CSS应用于HTML文档。

它没有在地址栏中显示/styles.css，因为你正在查看/。 CSS文件只是完全呈现/所代表的HTML文档所需的不同资源。