代码之家 › 专栏 › 技术社区 › AKUMA no ONI

为什么NodeJS不加载链接到html文件的CSS样式表?

mean mean-stack node.js

AKUMA no ONI · 技术社区 · 6 年前

社区。我在这里有点不知所措。我对NodeJS比较陌生,运行时环境的运行方式出乎我的意料。事实证明,这对许多其他尝试学习node的人来说也是一个问题,NodeJS的学习曲线比LAMP堆栈上的PHP要陡峭。说到重点,这里有几个“你好世界!”在NodeJS上漂浮,还有一些其他的材料。大部分都是毫无价值的。

//NODEJS EXAMPLE

var http = require('http');
var fs = require('fs');

http.createServer(function (req, res){
    fs.readFile('index.html', function(err, data){
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write(data);
    return res.end();
  });
}).listen(8080);

所有的教程都以一点代码或者类似的东西结束,就像上面的代码一样,这就是我的问题所在。代码是一个简单的服务器,它加载HTML文档,但它不会加载任何通过下面的标记链接到它们的CSS样式表:

<link rel="stylesheet" type="text/css" href="http://localhost/... (or wherever it's located)">

This is probably the best example of one of the Q&A's address this topic

需要快速路由模块可以工作,但是我发现我需要为一个不打算使用的Javascript库使用一个模块是很糟糕的,而且它仍然不能澄清问题,它只是把它扫到地毯下面。有人知道是什么问题使样式表不被包含,以及如何编写一个模块来修复它吗?

旁注:现在我正在读一本关于NodeJS的书,这本书教我如何路由请求和如何响应。我猜这是一个路由和路径名的问题,即使它不像编写一个模块那么简单,澄清是什么原因导致CSS链接标签没有加载也不错。谢谢您!

2 回复 | 直到 6 年前

jfriend00 6 年前

nodejs服务器未编程为在浏览器请求时发送任何样式表。

nodejs服务器和您创建的一样,默认情况下不提供任何文件。它只提供你编程的文件。所以,你的nodejs服务器被编程成只做一件事,那就是 index.html 不管从中请求什么URL。

用户为您的站点输入一些URL
浏览器向服务器发送该页的请求
index.html索引
浏览器分析并查找样式表链接
你的服务器发送它 index.html索引
浏览器意识到“那不是一个样式表”,你就没有样式

index.html索引 不管有什么要求。

没有人说你需要使用快速图书馆,但这就是它的作用。它使得在发出不同类型的请求时配置要发送的内容变得非常容易。而且,对于静态资源(如CSS文件)的请求,甚至可以配置为直接从文件系统自动发送它们。

如果您不想使用Express,您不必这样做,但是当请求不同的url时,您必须编写自己的代码来提供正确的数据。

如果要为此编写自己的代码,则必须创建某种 if/else 或 switch req.url 然后发送与请求的URL匹配的适当内容。然后,当浏览器请求您的样式表时,您实际上可以将适当的样式表发送给它,而不是 index.html索引

Hari Lubovac 6 年前

因为编写服务器端代码是为了处理all.http请求并传递相同的html内容,而不考虑路径。

类似于:

if(req.path === "" || req.path === "index.html")
     fs.read htnl file here
else if (req.path==="my.css")
     fs.read css file

学习使用浏览器开发工具(F12),它可以准确地显示浏览器发出的请求、发送的内容、返回的内容等等。