无法通过phantomjs webserver传递图像文件

时间:2012-06-19 22:36:51

标签: javascript node.js phantomjs

我正在尝试使用phantomjs webserver为我工作

我想提供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,请不要告诉我使用其他服务器

感谢

3 个答案:

答案 0 :(得分: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();

答案 1 :(得分:2)

我相信如果你正在读取PNG文件,你的fs.open()调用应该使用“rb”进行二进制读取模式。模式“r”适用于您的HTML,因为它是文本,但它仍然会读取PNG文件并将其提供给浏览器,但图像数据不可渲染。

答案 2 :(得分:-2)

您正在尝试使用异步函数,就好像它们是同步的一样。您正在使用的所有文件系统函数(exists()open()read())都是异步的,并尝试使用所需的结果调用回调(您没有提供)。他们没有return它。要么使用这些函数的同步版本,要么(更好)学习如何使用异步I / O.