Nodejs:服务的html页面没有链接到css

时间:2012-09-06 14:29:02

标签: html css node.js

我在nodejs中运行以下基本脚本来提供带有关联css样式表的html文件:

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

var serverPort = 8080;

var server = http.createServer(function(request, response) {

console.log('request starting ...');
var extname = path.extname(request.url);

var contentType = 'text/html';
    switch (extname) {
    case '.js':
        contentType = 'text/javascript';
        break;
    case '.css':
        contentType = 'text/css';
        break;
    }

fs.readFile('js/EmailDisplay/htm/index.html', function(error, content) {
    if (error) {
        console.log(error);
        response.writeHead(500);
        response.end();
    } else {
        console.log(contentType);
        response.writeHead(200, {'Content-Type': contentType});
        response.end(content,'utf-8');
    }
});
});

server.listen(serverPort);
console.log('Server running at localhost:' + serverPort +"/");

如果我在Firefox中打开文件(文件 - >打开文件),它会正确呈现。如果我转到localhost:8080,则会提供索引页面但不应用样式。为什么? fs.readFile块中的console.log向我显示正在读取这两个文件。

PS - 我知道有些软件包可以让我盲目地这样做(例如'connect')但是我试图在走这条路之前了解实际发生的事情。

2 个答案:

答案 0 :(得分:2)

问题可能在于这一行:

 fs.readFile('js/EmailDisplay/htm/index.html', function(error, content) {

您正在阅读并向客户端返回相同的html文件,即使请求.js.css也是如此。

您可能应该在代码中较早的交换机中设置文件的路径。

答案 1 :(得分:0)

我遇到了与nodejs和express相同的问题。请参阅下面的示例server.js

var express= require("express");
var app= express();
app.get("/", function(request, response) {
    response.sendFile("testing.html", {root: "."});
});
app.listen(8080);

可以通过添加以下行来添加静态内容:

app.use(express.static("foundation-5.4.6", {index: false}));

这使用express.static。在我的情况下,我从Foundation框架提供静态css和js,但您可以轻松地将其修改为您的特定public文件夹。