url = require("url"),
path = require("path"),
fs = require("fs")
http.createServer(function (req, res) {
var pathname=__dirname+url.parse(req.url).pathname
if (path.extname(pathname)=="") {
pathname+="/"
}
if (pathname.charAt(pathname.length-1)=="/"){
pathname+="index.html"
}
path.exists(pathname,function(exists){
if(exists){
switch(path.extname(pathname)){
case ".html":
res.writeHead(200, {"Content-Type": "text/html"})
break
case ".js":
res.writeHead(200, {"Content-Type": "text/javascript"})
break
case ".css":
res.writeHead(200, {"Content-Type": "text/css"})
break
case ".gif":
res.writeHead(200, {"Content-Type": "image/gif"})
break
case ".jpg":
res.writeHead(200, {"Content-Type": "image/jpeg"})
break
case ".png":
res.writeHead(200, {"Content-Type": "image/png"})
break
default:
res.writeHead(200, {"Content-Type": "application/octet-stream"})
}
fs.readFile(pathname,function (err,data){
res.end(data)
})
} else {
res.writeHead(404, {"Content-Type": "text/html"})
res.end("<h1>404 Not Found</h1>")
}
})
}).listen(8080, "127.0.0.1")
console.log("Server running at http://127.0.0.1:8080/")
原因很简单，在你的代码中fs.readFile("/login.html",function(err,html) 这句话导致你无法读取图片。
这句话表达的含义是： 我只读取 login.html 这个文件的内容，其他文件内容我都不读取
但是你要知道login.html文件中的每个图片都是外部资源，它们不属于html的内容
比如：假设login.html中有这样一段
<img src="/image/cat.png" />
因为上面的那段代码，现在 /image/cat.png 这个路径里的图片内容你无法读取
解决办法：
先引入 http、fs、url模块(这里省略)
var server = http.createServer( function( req , res ) { //创建服务器
var filename = url.parse( request.url ).pathname //获取文件路径
fs.readFile( filename , function( err , html ) { //读取html文件以及图片
................. // 这里直接使用filename可能会出错
}) // 如果你的图片不在目录文件夹中
｝).listen(8000)// 需这样写： '../'+filename
filename是一个变量，html路径以及图片路径会先后赋值给它 , 这样就保证了我们先后读取了html文件内容和图片内容
在html中 src=”/image/cat.png“ ，这里src指向的是外部资源，我们进入了一个误区：
我们以为图片也属于html的内容。其实不然，一个页面中的所有图片都不属于该页面的内容
它们是外部资源，所以我们读取一个html时，需要单独的去读取里面的图片
首先获取http，并创建一个web服务，监听本地端口1337，这个可以修改，任何未被占用的端口都可以用，并坚挺data事件和end事件，整个文件保存为app.js
写一个html5网页，这个网页中的内容如下面所示，目标是获取这个表单中的name 和age数据，action是服务器地址和端口,文件名index.html
可以用浏览器来打开这个端口，如下图中所示，对浏览器无要求，基本上常用的浏览器都可以打开
在命令行中运行服务，node app.js，然后在第三步中的html页面上点击提交按钮。这时命令行中的显示如下，这样就得到了表单中post的数据，完成了html中数据从前端到后台的过程
同时 网页跳到如下所示
下面这里贴上测试代码
////////////////app.js///////
var http = require('http')
var server = http.createServer(function(req,res){
if(req.url!=="/favicon.ico"){
req.on('data',function(data){
console.log("服务器接收到的数据： "+decodeURIComponent(data))
})
req.on("end",function(){
console.log('客户端请求数据全部接收完毕')
})
}
res.end()
}).listen(1337,"localhost",function(){
console.log("listened")
})
////////////////index.html///////
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Nodejs的data事件与end事件的回调函数测试用页面</title>
</head>
<body>
<form id= "form1" action = "http://localhost:1337/" method = "post">
姓名：<input type = 'text' name = "name" value ="dragon"><br/>
年龄：<input type = "number" name = "age" value ="25">
<input type = "submit" value =" 提交"/>
</form>
</body>
</html>
