2012-09-06 66 views
2

我有以下基本的腳本中的NodeJS擔任了相關的CSS樣式表的HTML文件運行:的NodeJS:曾任html頁面沒有鏈接到CSS

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中打開文件(文件 - >打開文件),它呈現正常。如果我轉到本地主機:8080索引頁面被提供,但沒有應用到它的樣式。爲什麼? fs.readFile塊中的console.log顯示我正在讀取這兩個文件。

PS - 我知道有一些軟件包會讓我盲目地做這個(例如'連接'),但我試圖理解在走這條路線之前究竟發生了什麼。

回答

2

問題可能就出在這行:

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

您正在閱讀並返回給客戶端相同的HTML文件,甚至當被請求.js.css

您應該在您之前在代碼中使用的開關中設置沿其內容類型的文件路徑。

+0

得到它的工作,非常感謝!我是一個javascript/node/html/css noob,學習曲線非常陡峭。來自Matlab我仍然只是意識到低層nodejs(無包)是多少,以及路徑的重要性。 – MikeB

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文件夾。