2017-03-21 10 views
2

おはよう、(NodeJS)HttpサーバーがフォルダからJS/CSSファイルをロードしない

私のNodeJS httpサーバーには小さな問題があります。サーバーはCSS/JSファイルをフォルダからロードせず、URLからしか読み込めません。理由はわかりません。誰かが時間をかけて何がうまくいかなかったかについてのヒントを教えていただければ幸いです。ここで

は、サーバーのコードです:

var http = require("http"); 
var gs = require("querystring"); 
var url = require("url"); 
var fs = require("fs"); 

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

//HTML 
if (request.url === "/") { 
    sendFileContent(response, "HTML/Login.html", "text/html"); 
    console.log("Requested URL : " + request.url + "\n"); 
} 
else if (request.url === "/main") { 
    sendFileContent(response, "HTML/Main_Home.html", "text/html"); 
    console.log("Requested URL : " + request.url + "\n"); 
} 
// JS/CSS/Other formats 
else if (/^\/[a-zA-Z0-9\/]*.js$/.test(request.url.toString(1))) { 
    sendFileContent(response, request.url.toString().substring(1), "text/javascript"); 
} 
else if (/^\/[a-zA-Z0-9\/]*.css$/.test(request.url.toString())) 
{   
    sendFileContent(response, request.url.toString().substring(1), "text/css"); 
} 
else if (/^\/[a-zA-Z0-9\/]*.json$/.test(request.url.toString())) 
{ 
    sendFileContent(response, request.url.toString().substring(1), "application/json"); 
} 
else if (/^\/[a-zA-Z0-9\/]*.ts$/.test(request.url.toString())) 
{ 
    sendFileContent(response, request.url.toString().substring(1), "text/javascript"); 
} 
else if (/^\/[a-zA-Z0-9\/]*.png$/.test(request.url.toString())) 
{ 
    sendFileContent(response, request.url.toString().substring(1), "image/png"); 
} 
else if (/^\/[a-zA-Z0-9\/]*.jpg$/.test(request.url.toString())) 
{ 
    sendFileContent(response, request.url.toString().substring(1), "image/jpeg"); 
} 
else 
{ 
    console.log("Requested URL : " + request.url + "\n"); 
    response.end(); 
} 
}); 

server.listen(1337, function() 
{ 
    require("console-stamp")(console, '[HH:MM:ss]'); 
    console.log("HTTP Server runs on port : 1337"); 

}); 

console.log("Server ready...."); 

そして、ここではSend file content機能は次のとおりです。

function sendFileContent(response, fileName, contentType){ 
fs.readFile(fileName, function (err, data) { 
    if (err) { 
     response.writeHead(404); 
     response.end("Not Found!"); 
    } 
    else { 
     response.writeHead(200, { "Content-Type": contentType }); 
     response.end(data); 
    } 

}); 
}; 

そして、これは私がありがとう

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
<link type="text/css" rel="stylesheet" href="../materialize/css/materialize.min.css" media="screen,projection" /> 
<link type="text/css" rel="stylesheet" href="../CSS/App.css" /> 
<title></title> 
<script type="text/javascript" src="../jquery/jquery-3.2.0.min.js"></script> 
<script type="text/javascript" src="../materialize/js/materialize.min.js">  </script> 
<script type="text/javascript" src="../Javascript/Main_App.js"></script> 

のhtml内のファイルを呼び出す方法ですお時間を頂きまして !

+0

上記のファイルの1つに直接ブラウズしようとしましたか?可能性のある原因は不正なパスによるものです。 –

答えて

1

独自の静的ファイルサーバーを実装しようとしていますが、あなたのアプローチを考え直す必要があると思っていること以外にも、実装に非常に多くの問題があります。

スタティックファイルを提供するには、express.staticのような実用的なソリューションを使用する方がはるかに簡単ですが、本当に必要な場合はExpressなしのソリューションについては以下をお読みください。 express.staticを持つ例:

var path = require('path'); 
var express = require('express'); 
var app = express(); 

var dir = path.join(__dirname, 'public'); 

app.use(express.static(dir)); 

app.listen(3000, function() { 
    console.log('Listening on http://localhost:3000/'); 
}); 

、接続し使用してより多くのオプションについては、この答えを参照表現は、httpやネット:何をしての例があるという答えでは

express.staticexpress.staticなしでconnectを使用してを使用してここでしようとしていますを使用し、netを使用し、未処理のTCPソケットを使用するバージョンでさえ、ここのコードほど複雑ではありません。あなたはそれを見て、あなたのコードをthese examplesに置くことをお勧めします。

+0

ありがとう、私はそうする:) – MarkL

関連する問題