nodejs無法提供靜態文件-下載它們

Question

我正在使用nodejs，創建一個簡單的服務器，還處理一些ajax。 當我轉到localhost:4000 ，頁面不會呈現，而是自動下載一個空文件。 它被命名為“下載文件”，零字節，無擴展名。

我認為我的客戶和服務器非常簡單。 很抱歉出現一般性問題，但我不明白為什么會這樣。

提前致謝

客戶端-一個簡單的表單和一個發送json類型數據的XHR

<html>
    <head>        <title>Chatrooms</title>    </head>    
    <body>
<form id="fruitform" method="post" action="/">
<div class="table">
<div class="row">
<div class="cell label">Bananas:</div>
<div class="cell"><input name="bananas" value="2"/></div>
</div>
<div class="row">
<div class="cell label">Apples:</div>
<div class="cell"><input name="apples" value="5"/></div>
</div>
<div class="row">
<div class="cell label">Cherries:</div>
<div class="cell"><input name="cherries" value="20"/></div>
</div>
<div class="row">
<div class="cell label">Total:</div>
<div id="results" class="cell">0 items</div>
</div>
</div>
<button id="submit" type="button">Submit Form</button>
</form>
<div id="results"></div>
<div id="de"></div>

 </body>
</html>

<script type="text/javascript">

document.getElementById("submit").onclick = handleButtonPress;

function handleButtonPress(e) {
    e.preventDefault();
    var formData = "";
    //gather all input values in a json type string
    var inputElements = document.getElementsByTagName("input");
    for (var i = 0; i < inputElements.length; i++) {
        formData += inputElements[i].name + "=" + inputElements[i].value + "&";     
    }
    formData = formData.slice(0, -1);
    var hr = new XMLHttpRequest();
    hr.open("POST", "/formHandler", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            document.getElementById("results").innerHTML = hr.responseText;
        }
    }
    hr.send(formData);
}
</script>

服務器

//dependencies
var http = require ('http');
var fs = require ('fs');
var path = require ('path');
var mime = require ('mime');
var qs = require('querystring');


//this is the http server
var server = http.createServer(function (request, response){
    var filePath = false;
    if (request.url == '/'){
        filePath='public/index.html';//default static file
    }

    if (request.url == '/formHandler'){//handle XHR
            if (request.method=="POST"){
                var rrr="rrr";
                response.writeHead(200,{"content-type":"text/plain"});
                response.write(rrr);
                response.end(rrr);
            }
    }

    else{
        filePath='public'+request.url;//set relative file path
    }
    var absPath = './'+filePath;
    serveStatic(request, response, cache, absPath);//serve the static file

});

server.listen(4000, function(){
    console.log("Chatrooms server on port 4000");
    }
);

//read static files 
function serveStatic(request, response,cache, absPath){
    fs.readFile(absPath, function(err, data){
            sendFile(request, response, absPath, data);

    })
}

//serve file data
function sendFile(request, response, filePath, fileContents){
    response.writeHead(
        200,{"content-type":mime.lookup(path.basename(filePath))}
    );
    response.end(fileContents);     
}

更新如果我從服務器上刪除以下部分，它工作正常。 還是不明白發生了什么

    if (request.url == '/formHandler'){
        console.log("inside ajax if");
            console.log("inside formPro");
            if (request.method=="POST"){
                console.log("inside second ajax if");
                var rrr="rrr";
                response.writeHead(200,{"content-type":"text/plain"});
                response.write(rrr);
                response.end(rrr);
                console.log("finished sending rrr");
            }
    }

Answer 1

fs.readFile最有可能返回錯誤，您將忽略該錯誤。

提供靜態文件時，您不應像這樣將整個內容讀入內存。 Node.JS的全部重點是保持I / O自由流動。

使用fs.createReadStream(filePath).pipe(response)代替，盡管您將需要添加錯誤偵聽器或在域中運行。

更新

錯誤比比皆是-您不會從任何情況下返回，而只是繼續進行下一個。

即，您可以同時調用request.end()和serveStatic 。

Answer 2

我建議您使用節點表達模塊http://expressjs.com/ ，它將允許您編寫自定義模板渲染器以及包括CSS和JS圖像文件的靜態頁面。

只需使用安裝Express

npm -g install express

Answer 3

在這里，對@Dickens答案進行跟進是基本的Express應用程序，它可以處理您的表單以及./public/所有靜態文件。

//dependencies
var http = require ('http');
var express = require('express'); // npm install --save express
var app = express();

app.use(express.static(__dirname+'/public'));

app.post('/formHandler', function(req, res){
  res.status(200).send('rrr');
})
var server = http.createServer(app);

server.listen(4000, function(){
  console.log("Chatrooms server on port 4000");
});


// Test with:
// curl -vX POST http://localhost:4000/formHandler
// curl -vX GET http://localhost:4000/index.html

nodejs無法提供靜態文件-下載它們

問題描述

3 個解決方案

解決方案1
1 已采納 2015-06-12 16:21:39

解決方案2
1 2015-06-12 16:23:50

解決方案3
0 2015-06-12 17:02:26

nodejs無法提供靜態文件-下載它們

問題描述

3 個解決方案

解決方案1 1 已采納 2015-06-12 16:21:39

解決方案2 1 2015-06-12 16:23:50

解決方案3 0 2015-06-12 17:02:26

解決方案1
1 已采納 2015-06-12 16:21:39

解決方案2
1 2015-06-12 16:23:50

解決方案3
0 2015-06-12 17:02:26