我正在练习纯 Node js,我遇到了一件关于 http 协议(protocol)的事情。 经过一个小时左右的搜索和测试我的代码后,我终于为我的 html 页面提供了 css。这是我的代码:
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 协议(protocol)的设计方式,但你能帮忙解释一下这个协议(protocol)吗? 提前谢谢你。
最佳答案
如果您在地址栏中输入了 /styles.css
,那么您将看到 CSS 文件的源代码。例如:this link .
您键入 /
,然后浏览器要求服务器 /
,服务器以 HTML 文档作为响应。
然后浏览器呈现 HTML 文档。我假设 HTML 文档包含如下内容:
<link rel=stylesheet href=/styles.css>
因此浏览器向服务器请求 /styles.css
并且服务器以 CSS 文件作为响应。然后浏览器将该 CSS 应用于 HTML 文档。
它不会在地址栏中显示 /styles.css
,因为您正在查看 /
。 CSS 文件只是完全呈现 /
表示的 HTML 文档所需的不同资源。
关于html - Node JS 服务 html 文件与 css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54963910/