2012-06-19 178 views
6

我試圖TP得到phantomjs Web服務器爲我工作無法通過phantomjs網絡服務器提供圖像文件

我想爲2個文件,HTML文件,PNG圖像文件,HTML文件送達良好,正確呈現在瀏覽器中,但PNG文件不是

這裏是服務器

var fs = require('fs'); 
function loadFile(name){ 
if(fs.exists(name)){ 
    console.log(name+ " File exist"); 
    return fs.open(name,"r"); 
}else { 
    console.log("File do not exist"); 
} 
} 
var server, service; 

server = require('webserver').create(); 

service = server.listen(8080, function (request, response) {  

if(request.url.split(".")[1] === "html"){ 
    var fi = loadFile("./test.html"); 
    response.statusCode = 200; 
    response.write(fi.read()); 
    fi.close(); 
    response.close(); 
}else if (request.url.split(".")[1] === "png"){ 
    var fi = loadFile("./output_87.png"); 
    response.headers = {"Content-Type":"image/png"}; 
    response.statusCode = 200; 
    response.write(fi.read()); 
    fi.close(); 
    response.close(); 
} 
}); 

的代碼,這是HTML文件的標記

<html> 
<head><title>title</title></head> 
<body><h1> Hello world </h1> 
    <img src="output_87.png" alt="image"> 
</body> 
</html> 

觀看在瀏覽器這個文件時,PNG文件不呈現,即使我試圖將瀏覽器指向PNG文件,它不會使它

我與Chrome開發者工具的網絡檢查狀態並確認該文件是由瀏覽器完全下載的

有什麼問題?

順便說一下,我必須使用phantomjs,請□不告訴我用另一臺服務器

感謝

+1

我剛剛發送的PR上phantomjs庫來解決這個問題https://github.com/ariya/phantomjs/pull/288 /文件(代碼可能很糟糕,但適用於我) – NiKo

回答

-2

你試圖使用異步功能,就好像它們是同步。您使用的所有文件系統功能(exists(),open()read())都是異步的,並嘗試使用所需的結果調用回調(您沒有提供);他們不是return它。要麼使用這些函數的同步版本,要麼(更好地)學習如何使用異步I/O。

+0

示例代碼沒有任何異步。這是PhantomJS和Node.js腳本! –

2

如果您正在閱讀PNG文件,我相信您的fs.open()調用應該使用「rb」作爲二進制讀取模式。模式「r」適用於您的html,因爲它是文本,但它仍會讀取PNG文件並將其提供給瀏覽器,因此圖像數據無法呈現。

7

這對我的作品(假設你有響應對象):

var fs = require("fs"); 
    var image = fs.open("image.png", "rb"); 
    var data = image.read(); 
    image.close(); 
    response.setHeader("Content-Type", "image/png"); 
    response.setEncoding("binary"); 
    response.write(data); 
    response.close(); 
+0

嗨親愛的,感謝您的參與,這是一個3年的問題,它可能適用於今天的版本...什麼是您使用的phantomjs版本? – Joseph

+0

好點,我使用PhantomJS v2.1.1 – CarelZA