Question

我正在使用node.js并尝试发送.html文件包含这些标记：

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="This is my personal profile website" />
<link rel="stylesheet" type="text/css" href="profile_design.css" />
<link rel="stylesheet" href="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />

<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="profile.js"></script>

这是node.js中的HTTP服务器：

var fs = require('fs');
var http =  require ('http');
http.createServer(function (request, response) {

    console.log('request starting...');

    fs.readFile('C:/Users/.../index.html', function(error, content) {
        if (error) {

            response.writeHead(500);
            response.end();
        } else {
            //response.writeHead(200, { 'Content-Type': 'text/html' });
            response.end(content, 'utf-8');
        }

        console.log(error);
    });

}).listen(8080);

问题是index.html文件以良好的方式返回，但所有JavaScript文件和CSS都没有正确发送到客户端。问题是如何发送那些.js和.css文件？

Answer 1

我遇到了同样的问题，但在我了解幕后发生的事情之前，我不想使用任何外部模块或框架。所以，这就是我为自己解决CSS文件问题的方法。希望它对某人有用。

每当我收到/style.css的请求时，我都会调用这个简单的函数：

function style(response) {

  console.log("Request handler 'style' was called.");

  fs.readFile("style.css", function(error, file) {

    if(error) {

        response.writeHead(500, {"Content-Type": "text/plain"});

        response.write(error + "\n");

        response.end();

    } else {

        response.writeHead(200, {"Content-Type": "text/css"});

        response.write(file);

        response.end();

    }

  });

}

基本上，我们会读取静态文件并根据请求将其发回。请注意，您必须注意路由您的请求。

Answer 2

浏览器尝试通过端口8080从您的node.js服务器获取.css和.js资源文件。但是，除了index.html文件之外，您的服务器不会提供任何服务，而与请求无关。

建议：使用express.js插件并设置更复杂的 routing 。

Answer 3

您需要拥有一个为node-paperboy或node-static等资源提供服务的处理程序，或者制作您自己的资源。

Answer 4

我不确定这是否回答了你的问题，但在我的情况下，我将所有的css和js文件添加到view文件夹中，然后我在server.js中添加了以下内容

server.use（express.static（__目录名+ '/视图/'））;

这解决了我的问题

Answer 5

这个问题很容易解决，就是在你的html doc（index.html）的末尾添加你的style.css代码，就在结束体标记之前。这实际上适用于我的情况。只需添加：

<style type="text/css"> "your css code goes here" </style>

为什么本地.css文件和.js文件没有链接到index.html文件？

5 个答案: