Node.js 静态web服务

我们想要通过Node.js去访问静态的页面，比如我们在浏览器输入http://localhost:8001/index.html，然后就返回index.html的信息。那么如何用Node.js实现加载静态的页面呢？

现在我们有一个static文件夹，里面包含了静态的页面资源：



首先我们要用Nodejs 创建一个 WEB 服务器

//引入http模块
var http = require('http');

//fs模块

var fs = require('fs');
http.createServer(function(req,res){

//http://localhost:8001/news.html    /news.html
//http://localhost:8001/index.html    /index.html

//css/dmb.bottom.css

var pathname = req.url;
if(pathname == '/'){
pathname = '/index.html'; /*默认加载的首页*/
}

if(pathname != '/favicon.ico'){  /*过滤请求favicon.ico*/
console.log(pathname);
//文件操作获取 static下面的index.html
}

}).listen(8001);

我们通过req.url可以获取到我们所要的资源，如：/index.html,获取到pathname之后我们需要用文件操作模块，获取static资源下的index.html文件。接下来我们来完善我们的代码。

//引入http模块
var http = require('http');

//fs模块

var fs = require('fs');
http.createServer(function(req,res){

//http://localhost:8001/news.html    /news.html
//http://localhost:8001/index.html    /index.html

//css/dmb.bottom.css

var pathname = req.url;
if(pathname == '/'){
pathname = '/index.html'; /*默认加载的首页*/
}

if(pathname != '/favicon.ico'){  /*过滤请求favicon.ico*/
console.log(pathname);
//文件操作获取 static下面的index.html

fs.readFile('static' + pathname,function(err,data){

if(err){  /*没有这个文件*/
console.log('404');
res.end(); /*结束响应*/
}else{ /*返回这个文件*/
res.writeHead(200,{"Content-Type":"text/html;charset='utf-8'"});
res.write(data);
res.end(); /*结束响应*/
}

})

}

}).listen(8001);

我们通过fs.readFile来获取static下面的pathname(如：/index.html ,最终路径： static/index.html ),如果报错，我们输出404，否则，我们把读取的信息响应给浏览器。

现在我们试一试来访问以下http://localhost:8001/index.html：



后台输出了pathname：



我们可以看到浏览器发起了很多次请求，去请求其他的相关资源，比如js，css等等。





但为什么我们在index.html看到的界面却没有完全显示，css起不到作用。

原因是：我们请求的mime type 是text/html；

res.writeHead(200,{"Content-Type":"text/html;charset='utf-8'"});

所以css和js都只是以text/html的形式返回，而我们需要的是：”text/css”或者是”application/x-javascript”，所以我们继续改进我们的代码。我们现在需要根据请求资源后缀来给定对应的mime type，比如public.css 我们指定为text/css，template.js我们指定为application/x-javascript

我们来写一个方法，根据后缀获得指定的mime type。

exports.getMime=function(extname){

switch (extname){

case '.html':

return 'text/html';
case '.css':

return 'text/css';

case '.js':

return 'text/javascript';

default:
return 'text/html';
}

}

接下来我们来改进我们之前的代码：

//引入http模块
var http = require('http');

//fs模块

var fs = require('fs');

//path模块
var path = require('path');  /*nodejs自带的模块*/

var mimeModel = require('./model/getmime.js');

//console.log(mime.getMime('.css'));   //获取文件类型

http.createServer(function(req,res){

//http://localhost:8001/news.html    /news.html
//http://localhost:8001/index.html    /index.html

//css/dmb.bottom.css

var pathname = req.url;
if(pathname == '/'){
pathname = '/index.html'; /*默认加载的首页*/
}

//获取文件的后缀名
var extname = path.extname(pathname);

if(pathname != '/favicon.ico'){  /*过滤请求favicon.ico*/
//console.log(pathname);
//文件操作获取 static下面的index.html

fs.readFile('static/' + pathname,function(err,data){

if(err){  /*没有这个文件*/

console.log('404');

fs.readFile('static/404.html',function(error,data404){
if(error){
console.log(error);
res.end(); /*结束响应*/
}
res.writeHead(404,{"Content-Type":"text/html;charset='utf-8'"});
res.write(data404);
res.end(); /*结束响应*/
})

}else{ /*返回这个文件*/

var mime = mimeModel.getMime(extname);  /*获取文件类型*/
res.writeHead(200,{"Content-Type":"" + mime + ";charset='utf-8'"});
res.write(data);
res.end(); /*结束响应*/
}

})

}

}).listen(8001);

我们通过

require('path')

引入path模块，通过path模块中的

path.extname(pathname)

获得后缀名，最后通过下面这个方法

var mime = mimeModel.getMime(extname);  /*获取文件类型*/

来获取对应的mime type，最后设置响应头：

res.writeHead(200,{"Content-Type":"" + mime + ";charset='utf-8'"});

我们还对我们的找不到文件或者错误的情况进行了处理，如果error了，我们进行如下设置：

res.writeHead(404,{"Content-Type":"text/html;charset='utf-8'"});
res.write(data404);
res.end(); /*结束响应*/

设置响应状态码为404，并返回一个404页面。

我们继续访问：http://localhost:8001/index.html



可以看到css文件起到作用了。

如果我们输入一个不存在的资源路径：http://localhost:8001/111111.html

我们可以看到：



我们可以看到响应回来的.css后缀的文件，

Content-Type:text/css;charset='utf-8'

但我们的代码还是有点问题，我们可以看到：





http://localhost:8001/json/all.json?41437223455954575显示不出内容

因为我们用req.url 获取到的是/json/all.json?41437223455954575，而我们实际要的是/json/all.json



我们继续改进我们的代码：

//引入http模块
var http = require('http');

//fs模块

var fs = require('fs');

//path模块
var path = require('path');  /*nodejs自带的模块*/

//url模块

var url = require('url');

var mimeModel = require('./model/getmime.js');

//console.log(mime.getMime('.css'));   //获取文件类型

http.createServer(function(req,res){

//http://localhost:8001/news.html    /news.html
//http://localhost:8001/index.html    /index.html

//css/dmb.bottom.css

var pathname = url.parse(req.url).pathname;

console.log(pathname);

if(pathname == '/'){
pathname = '/index.html'; /*默认加载的首页*/
}

//获取文件的后缀名
var extname = path.extname(pathname);

if(pathname != '/favicon.ico'){  /*过滤请求favicon.ico*/
//console.log(pathname);
//文件操作获取 static下面的index.html

fs.readFile('static/' + pathname,function(err,data){

if(err){  /*没有这个文件*/

console.log('404');

fs.readFile('static/404.html',function(error,data404){
if(error){
console.log(error);
}
res.writeHead(404,{"Content-Type":"text/html;charset='utf-8'"});
res.write(data404);
res.end(); /*结束响应*/
})

}else{ /*返回这个文件*/

var mime = mimeModel.getMime(extname);  /*获取文件类型*/
res.writeHead(200,{"Content-Type":"" + mime + ";charset='utf-8'"});
res.write(data);
res.end(); /*结束响应*/
}

})

}

}).listen(8001);

我们通过：

url.parse(req.url).pathname

就可以获取到真正我们需要的资源路径了。这次我们再次访问index.html页面





现在我们发现我们已经可以成功的访问到刚刚的文件了，并且显示出了文件中的图片的信息了。

但是我们发现我们还有一些问题，图片jpg返回的content-type居然是text/html



所以我们要继续改进我们的代码，这次我们读取mime.json，来获取对应的mime type。

{ ".323":"text/h323" ,
".3gp":"video/3gpp" ,
".aab":"application/x-authoware-bin" ,
".aam":"application/x-authoware-map" ,
".aas":"application/x-authoware-seg" ,
".acx":"application/internet-property-stream" ,
".ai":"application/postscript" ,
".aif":"audio/x-aiff" ,
".aifc":"audio/x-aiff" ,
".aiff":"audio/x-aiff" ,
".als":"audio/X-Alpha5" ,
".amc":"application/x-mpeg" ,
".ani":"application/octet-stream" ,
".apk":"application/vnd.android.package-archive" ,
".asc":"text/plain" ,
".asd":"application/astound" ,
".asf":"video/x-ms-asf" ,
".asn":"application/astound" ,
".asp":"application/x-asap" ,
".asr":"video/x-ms-asf" ,
".asx":"video/x-ms-asf" ,
".au":"audio/basic" ,
".avb":"application/octet-stream" ,
".avi":"video/x-msvideo" ,
".awb":"audio/amr-wb" ,
".axs":"application/olescript" ,
".bas":"text/plain" ,
".bcpio":"application/x-bcpio" ,
".bin ":"application/octet-stream" ,
".bld":"application/bld" ,
".bld2":"application/bld2" ,
".bmp":"image/bmp" ,
".bpk":"application/octet-stream" ,
".bz2":"application/x-bzip2" ,
".c":"text/plain" ,
".cal":"image/x-cals" ,
".cat":"application/vnd.ms-pkiseccat" ,
".ccn":"application/x-cnc" ,
".cco":"application/x-cocoa" ,
".cdf":"application/x-cdf" ,
".cer":"application/x-x509-ca-cert" ,
".cgi":"magnus-internal/cgi" ,
".chat":"application/x-chat" ,
".class":"application/octet-stream" ,
".clp":"application/x-msclip" ,
".cmx":"image/x-cmx" ,
".co":"application/x-cult3d-object" ,
".cod":"image/cis-cod" ,
".conf":"text/plain" ,
".cpio":"application/x-cpio" ,
".cpp":"text/plain" ,
".cpt":"application/mac-compactpro" ,
".crd":"application/x-mscardfile" ,
".crl":"application/pkix-crl" ,
".crt":"application/x-x509-ca-cert" ,
".csh":"application/x-csh" ,
".csm":"chemical/x-csml" ,
".csml":"chemical/x-csml" ,
".css":"text/css" ,
".cur":"application/octet-stream" ,
".dcm":"x-lml/x-evm" ,
".dcr":"application/x-director" ,
".dcx":"image/x-dcx" ,
".der":"application/x-x509-ca-cert" ,
".dhtml":"text/html" ,
".dir":"application/x-director" ,
".dll":"application/x-msdownload" ,
".dmg":"application/octet-stream" ,
".dms":"application/octet-stream" ,
".doc":"application/msword" ,
".docx":"application/vnd.openxmlformats-officedocument.wordprocessingml.document" ,
".dot":"application/msword" ,
".dvi":"application/x-dvi" ,
".dwf":"drawing/x-dwf" ,
".dwg":"application/x-autocad" ,
".dxf":"application/x-autocad" ,
".dxr":"application/x-director" ,
".ebk":"application/x-expandedbook" ,
".emb":"chemical/x-embl-dl-nucleotide" ,
".embl":"chemical/x-embl-dl-nucleotide" ,
".eps":"application/postscript" ,
".epub":"application/epub+zip" ,
".eri":"image/x-eri" ,
".es":"audio/echospeech" ,
".esl":"audio/echospeech" ,
".etc":"application/x-earthtime" ,
".etx":"text/x-setext" ,
".evm":"x-lml/x-evm" ,
".evy":"application/envoy" ,
".exe":"application/octet-stream" ,
".fh4":"image/x-freehand" ,
".fh5":"image/x-freehand" ,
".fhc":"image/x-freehand" ,
".fif":"application/fractals" ,
".flr":"x-world/x-vrml" ,
".flv":"flv-application/octet-stream" ,
".fm":"application/x-maker" ,
".fpx":"image/x-fpx" ,
".fvi":"video/isivideo" ,
".gau":"chemical/x-gaussian-input" ,
".gca":"application/x-gca-compressed" ,
".gdb":"x-lml/x-gdb" ,
".gif":"image/gif" ,
".gps":"application/x-gps" ,
".gtar":"application/x-gtar" ,
".gz":"application/x-gzip" ,
".h":"text/plain" ,
".hdf":"application/x-hdf" ,
".hdm":"text/x-hdml" ,
".hdml":"text/x-hdml" ,
".hlp":"application/winhlp" ,
".hqx":"application/mac-binhex40" ,
".hta":"application/hta" ,
".htc":"text/x-component" ,
".htm":"text/html" ,
".html":"text/html" ,
".hts":"text/html" ,
".htt":"text/webviewhtml" ,
".ice":"x-conference/x-cooltalk" ,
".ico":"image/x-icon" ,
".ief":"image/ief" ,
".ifm":"image/gif" ,
".ifs":"image/ifs" ,
".iii":"application/x-iphone" ,
".imy":"audio/melody" ,
".ins":"application/x-internet-signup" ,
".ips":"application/x-ipscript" ,
".ipx":"application/x-ipix" ,
".isp":"application/x-internet-signup" ,
".it":"audio/x-mod" ,
".itz":"audio/x-mod" ,
".ivr":"i-world/i-vrml" ,
".j2k":"image/j2k" ,
".jad":"text/vnd.sun.j2me.app-descriptor" ,
".jam":"application/x-jam" ,
".jar":"application/java-archive" ,
".java":"text/plain" ,
".jfif":"image/pipeg" ,
".jnlp":"application/x-java-jnlp-file" ,
".jpe":"image/jpeg" ,
".jpeg":"image/jpeg" ,
".jpg":"image/jpeg" ,
".jpz":"image/jpeg" ,
".js":"application/x-javascript" ,
".jwc":"application/jwc" ,
".kjx":"application/x-kjx" ,
".lak":"x-lml/x-lak" ,
".latex":"application/x-latex" ,
".lcc":"application/fastman" ,
".lcl":"application/x-digitalloca" ,
".lcr":"application/x-digitalloca" ,
".lgh":"application/lgh" ,
".lha":"application/octet-stream" ,
".lml":"x-lml/x-lml" ,
".lmlpack":"x-lml/x-lmlpack" ,
".log":"text/plain" ,
".lsf":"video/x-la-asf" ,
".lsx":"video/x-la-asf" ,
".lzh":"application/octet-stream" ,
".m13":"application/x-msmediaview" ,
".m14":"application/x-msmediaview" ,
".m15":"audio/x-mod" ,
".m3u":"audio/x-mpegurl" ,
".m3url":"audio/x-mpegurl" ,
".m4a":"audio/mp4a-latm" ,
".m4b":"audio/mp4a-latm" ,
".m4p":"audio/mp4a-latm" ,
".m4u":"video/vnd.mpegurl" ,
".m4v":"video/x-m4v" ,
".ma1":"audio/ma1" ,
".ma2":"audio/ma2" ,
".ma3":"audio/ma3" ,
".ma5":"audio/ma5" ,
".man":"application/x-troff-man" ,
".map":"magnus-internal/imagemap" ,
".mbd":"application/mbedlet" ,
".mct":"application/x-mascot" ,
".mdb":"application/x-msaccess" ,
".mdz":"audio/x-mod" ,
".me":"application/x-troff-me" ,
".mel":"text/x-vmel" ,
".mht":"message/rfc822" ,
".mhtml":"message/rfc822" ,
".mi":"application/x-mif" ,
".mid":"audio/mid" ,
".midi":"audio/midi" ,
".mif":"application/x-mif" ,
".mil":"image/x-cals" ,
".mio":"audio/x-mio" ,
".mmf":"application/x-skt-lbs" ,
".mng":"video/x-mng" ,
".mny":"application/x-msmoney" ,
".moc":"application/x-mocha" ,
".mocha":"application/x-mocha" ,
".mod":"audio/x-mod" ,
".mof":"application/x-yumekara" ,
".mol":"chemical/x-mdl-molfile" ,
".mop":"chemical/x-mopac-input" ,
".mov":"video/quicktime" ,
".movie":"video/x-sgi-movie" ,
".mp2":"video/mpeg" ,
".mp3":"audio/mpeg" ,
".mp4":"video/mp4" ,
".mpa":"video/mpeg" ,
".mpc":"application/vnd.mpohun.certificate" ,
".mpe":"video/mpeg" ,
".mpeg":"video/mpeg" ,
".mpg":"video/mpeg" ,
".mpg4":"video/mp4" ,
".mpga":"audio/mpeg" ,
".mpn":"application/vnd.mophun.application" ,
".mpp":"application/vnd.ms-project" ,
".mps":"application/x-mapserver" ,
".mpv2":"video/mpeg" ,
".mrl":"text/x-mrml" ,
".mrm":"application/x-mrm" ,
".ms":"application/x-troff-ms" ,
".msg":"application/vnd.ms-outlook" ,
".mts":"application/metastream" ,
".mtx":"application/metastream" ,
".mtz":"application/metastream" ,
".mvb":"application/x-msmediaview" ,
".mzv":"application/metastream" ,
".nar":"application/zip" ,
".nbmp":"image/nbmp" ,
".nc":"application/x-netcdf" ,
".ndb":"x-lml/x-ndb" ,
".ndwn":"application/ndwn" ,
".nif":"application/x-nif" ,
".nmz":"application/x-scream" ,
".nokia-op-logo":"image/vnd.nok-oplogo-color" ,
".npx":"application/x-netfpx" ,
".nsnd":"audio/nsnd" ,
".nva":"application/x-neva1" ,
".nws":"message/rfc822" ,
".oda":"application/oda" ,
".ogg":"audio/ogg" ,
".oom":"application/x-AtlasMate-Plugin" ,
".p10":"application/pkcs10" ,
".p12":"application/x-pkcs12" ,
".p7b":"application/x-pkcs7-certificates" ,
".p7c":"application/x-pkcs7-mime" ,
".p7m":"application/x-pkcs7-mime" ,
".p7r":"application/x-pkcs7-certreqresp" ,
".p7s":"application/x-pkcs7-signature" ,
".pac":"audio/x-pac" ,
".pae":"audio/x-epac" ,
".pan":"application/x-pan" ,
".pbm":"image/x-portable-bitmap" ,
".pcx":"image/x-pcx" ,
".pda":"image/x-pda" ,
".pdb":"chemical/x-pdb" ,
".pdf":"application/pdf" ,
".pfr":"application/font-tdpfr" ,
".pfx":"application/x-pkcs12" ,
".pgm":"image/x-portable-graymap" ,
".pict":"image/x-pict" ,
".pko":"application/ynd.ms-pkipko" ,
".pm":"application/x-perl" ,
".pma":"application/x-perfmon" ,
".pmc":"application/x-perfmon" ,
".pmd":"application/x-pmd" ,
".pml":"application/x-perfmon" ,
".pmr":"application/x-perfmon" ,
".pmw":"application/x-perfmon" ,
".png":"image/png" ,
".pnm":"image/x-portable-anymap" ,
".pnz":"image/png" ,
".pot,":"application/vnd.ms-powerpoint" ,
".ppm":"image/x-portable-pixmap" ,
".pps":"application/vnd.ms-powerpoint" ,
".ppt":"application/vnd.ms-powerpoint" ,
".pptx":"application/vnd.openxmlformats-officedocument.presentationml.presentation" ,
".pqf":"application/x-cprplayer" ,
".pqi":"application/cprplayer" ,
".prc":"application/x-prc" ,
".prf":"application/pics-rules" ,
".prop":"text/plain" ,
".proxy":"application/x-ns-proxy-autoconfig" ,
".ps":"application/postscript" ,
".ptlk":"application/listenup" ,
".pub":"application/x-mspublisher" ,
".pvx":"video/x-pv-pvx" ,
".qcp":"audio/vnd.qcelp" ,
".qt":"video/quicktime" ,
".qti":"image/x-quicktime" ,
".qtif":"image/x-quicktime" ,
".r3t":"text/vnd.rn-realtext3d" ,
".ra":"audio/x-pn-realaudio" ,
".ram":"audio/x-pn-realaudio" ,
".rar":"application/octet-stream" ,
".ras":"image/x-cmu-raster" ,
".rc":"text/plain" ,
".rdf":"application/rdf+xml" ,
".rf":"image/vnd.rn-realflash" ,
".rgb":"image/x-rgb" ,
".rlf":"application/x-richlink" ,
".rm":"audio/x-pn-realaudio" ,
".rmf":"audio/x-rmf" ,
".rmi":"audio/mid" ,
".rmm":"audio/x-pn-realaudio" ,
".rmvb":"audio/x-pn-realaudio" ,
".rnx":"application/vnd.rn-realplayer" ,
".roff":"application/x-troff" ,
".rp":"image/vnd.rn-realpix" ,
".rpm":"audio/x-pn-realaudio-plugin" ,
".rt":"text/vnd.rn-realtext" ,
".rte":"x-lml/x-gps" ,
".rtf":"application/rtf" ,
".rtg":"application/metastream" ,
".rtx":"text/richtext" ,
".rv":"video/vnd.rn-realvideo" ,
".rwc":"application/x-rogerwilco" ,
".s3m":"audio/x-mod" ,
".s3z":"audio/x-mod" ,
".sca":"application/x-supercard" ,
".scd":"application/x-msschedule" ,
".sct":"text/scriptlet" ,
".sdf":"application/e-score" ,
".sea":"application/x-stuffit" ,
".setpay":"application/set-payment-initiation" ,
".setreg":"application/set-registration-initiation" ,
".sgm":"text/x-sgml" ,
".sgml":"text/x-sgml" ,
".sh":"application/x-sh" ,
".shar":"application/x-shar" ,
".shtml":"magnus-internal/parsed-html" ,
".shw":"application/presentations" ,
".si6":"image/si6" ,
".si7":"image/vnd.stiwap.sis" ,
".si9":"image/vnd.lgtwap.sis" ,
".sis":"application/vnd.symbian.install" ,
".sit":"application/x-stuffit" ,
".skd":"application/x-Koan" ,
".skm":"application/x-Koan" ,
".skp":"application/x-Koan" ,
".skt":"application/x-Koan" ,
".slc":"application/x-salsa" ,
".smd":"audio/x-smd" ,
".smi":"application/smil" ,
".smil":"application/smil" ,
".smp":"application/studiom" ,
".smz":"audio/x-smd" ,
".snd":"audio/basic" ,
".spc":"application/x-pkcs7-certificates" ,
".spl":"application/futuresplash" ,
".spr":"application/x-sprite" ,
".sprite":"application/x-sprite" ,
".sdp":"application/sdp" ,
".spt":"application/x-spt" ,
".src":"application/x-wais-source" ,
".sst":"application/vnd.ms-pkicertstore" ,
".stk":"application/hyperstudio" ,
".stl":"application/vnd.ms-pkistl" ,
".stm":"text/html" ,
".svg":"image/svg+xml" ,
".sv4cpio":"application/x-sv4cpio" ,
".sv4crc":"application/x-sv4crc" ,
".svf":"image/vnd" ,
".svg":"image/svg+xml" ,
".svh":"image/svh" ,
".svr":"x-world/x-svr" ,
".swf":"application/x-shockwave-flash" ,
".swfl":"application/x-shockwave-flash" ,
".t":"application/x-troff" ,
".tad":"application/octet-stream" ,
".talk":"text/x-speech" ,
".tar":"application/x-tar" ,
".taz":"application/x-tar" ,
".tbp":"application/x-timbuktu" ,
".tbt":"application/x-timbuktu" ,
".tcl":"application/x-tcl" ,
".tex":"application/x-tex" ,
".texi":"application/x-texinfo" ,
".texinfo":"application/x-texinfo" ,
".tgz":"application/x-compressed" ,
".thm":"application/vnd.eri.thm" ,
".tif":"image/tiff" ,
".tiff":"image/tiff" ,
".tki":"application/x-tkined" ,
".tkined":"application/x-tkined" ,
".toc":"application/toc" ,
".toy":"image/toy" ,
".tr":"application/x-troff" ,
".trk":"x-lml/x-gps" ,
".trm":"application/x-msterminal" ,
".tsi":"audio/tsplayer" ,
".tsp":"application/dsptype" ,
".tsv":"text/tab-separated-values" ,
".ttf":"application/octet-stream" ,
".ttz":"application/t-time" ,
".txt":"text/plain" ,
".uls":"text/iuls" ,
".ult":"audio/x-mod" ,
".ustar":"application/x-ustar" ,
".uu":"application/x-uuencode" ,
".uue":"application/x-uuencode" ,
".vcd":"application/x-cdlink" ,
".vcf":"text/x-vcard" ,
".vdo":"video/vdo" ,
".vib":"audio/vib" ,
".viv":"video/vivo" ,
".vivo":"video/vivo" ,
".vmd":"application/vocaltec-media-desc" ,
".vmf":"application/vocaltec-media-file" ,
".vmi":"application/x-dreamcast-vms-info" ,
".vms":"application/x-dreamcast-vms" ,
".vox":"audio/voxware" ,
".vqe":"audio/x-twinvq-plugin" ,
".vqf":"audio/x-twinvq" ,
".vql":"audio/x-twinvq" ,
".vre":"x-world/x-vream" ,
".vrml":"x-world/x-vrml" ,
".vrt":"x-world/x-vrt" ,
".vrw":"x-world/x-vream" ,
".vts":"workbook/formulaone" ,
".wav":"audio/x-wav" ,
".wax":"audio/x-ms-wax" ,
".wbmp":"image/vnd.wap.wbmp" ,
".wcm":"application/vnd.ms-works" ,
".wdb":"application/vnd.ms-works" ,
".web":"application/vnd.xara" ,
".wi":"image/wavelet" ,
".wis":"application/x-InstallShield" ,
".wks":"application/vnd.ms-works" ,
".wm":"video/x-ms-wm" ,
".wma":"audio/x-ms-wma" ,
".wmd":"application/x-ms-wmd" ,
".wmf":"application/x-msmetafile" ,
".wml":"text/vnd.wap.wml" ,
".wmlc":"application/vnd.wap.wmlc" ,
".wmls":"text/vnd.wap.wmlscript" ,
".wmlsc":"application/vnd.wap.wmlscriptc" ,
".wmlscript":"text/vnd.wap.wmlscript" ,
".wmv":"audio/x-ms-wmv" ,
".wmx":"video/x-ms-wmx" ,
".wmz":"application/x-ms-wmz" ,
".wpng":"image/x-up-wpng" ,
".wps":"application/vnd.ms-works" ,
".wpt":"x-lml/x-gps" ,
".wri":"application/x-mswrite" ,
".wrl":"x-world/x-vrml" ,
".wrz":"x-world/x-vrml" ,
".ws":"text/vnd.wap.wmlscript" ,
".wsc":"application/vnd.wap.wmlscriptc" ,
".wv":"video/wavelet" ,
".wvx":"video/x-ms-wvx" ,
".wxl":"application/x-wxl" ,
".x-gzip":"application/x-gzip" ,
".xaf":"x-world/x-vrml" ,
".xar":"application/vnd.xara" ,
".xbm":"image/x-xbitmap" ,
".xdm":"application/x-xdma" ,
".xdma":"application/x-xdma" ,
".xdw":"application/vnd.fujixerox.docuworks" ,
".xht":"application/xhtml+xml" ,
".xhtm":"application/xhtml+xml" ,
".xhtml":"application/xhtml+xml" ,
".xla":"application/vnd.ms-excel" ,
".xlc":"application/vnd.ms-excel" ,
".xll":"application/x-excel" ,
".xlm":"application/vnd.ms-excel" ,
".xls":"application/vnd.ms-excel" ,
".xlsx":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ,
".xlt":"application/vnd.ms-excel" ,
".xlw":"application/vnd.ms-excel" ,
".xm":"audio/x-mod" ,
".xml":"text/plain",
".xml":"application/xml",
".xmz":"audio/x-mod" ,
".xof":"x-world/x-vrml" ,
".xpi":"application/x-xpinstall" ,
".xpm":"image/x-xpixmap" ,
".xsit":"text/xml" ,
".xsl":"text/xml" ,
".xul":"text/xul" ,
".xwd":"image/x-xwindowdump" ,
".xyz":"chemical/x-pdb" ,
".yz1":"application/x-yz1" ,
".z":"application/x-compress" ,
".zac":"application/x-zaurus-zac" ,
".zip":"application/zip" ,
".json":"application/json"
}

我们来写一个方法来读取我们的mime.json

我先说下面这次操作可能是我们第一时间会想到的，但这种方法错误的，我们来看：

exports.getMime=function(fs,extname){  /*获取后缀名的方法*/

//.html

fs.readFile('./mime.json',function(err,data){

if(err){
console.log('mime.json文件不存在');
return false;
}
//console.log(data.toString());

var Mimes=JSON.parse(data.toString());

console.log(Mimes[extname]);

return Mimes[extname] || 'text/html';

});

}

我们通过文件模块操作mime.json文件，将读出来的数据通过JSON.parse转化为json对象，之后我们通过我们传进来的后缀，返回响应的mime type

比如，我们的后缀是.css,我们就通过：”.css”:”text/css” ，最后return对应的text/css。

上面看起来没什么问题，我们来看看我们写的代码会有什么结果：

//引入http模块
var http=require('http');

//fs模块

var fs=require('fs');

//path模块
var path=require('path');  /*nodejs自带的模块*/

//url模块

var url=require('url');

var mimeModel=require('./model/getmimefromfile.js');

//获取文件类型

console.log("mime type : " + mimeModel.getMime(fs, '.css'));

我们可以看到后台输出：



先打印出了undefined，后面才获取到text/css，这个原因就是因为Node.js的异步的原因。

在fs.readFile还没执行完，还没return最后的结果的时候，主程序已经结束了,所以这个时候获取的值自然是undefined。

所以上面这种写法是错误的。

我们可以改写成用同步的方式去读取文件：

exports.getMime=function(fs,extname){  /*获取后缀名的方法*/

//把读取数据改成同步
var data=fs.readFileSync('./mime.json');
//data.toString() 转换成json字符串
var Mimes=JSON.parse(data.toString());  /*把json字符串转换成json对象*/
return Mimes[extname] || 'text/html';

}

如果我们想要继续使用异步操作该怎么办？

我们可以通过Nodejs 回调来处理异步

下面我来举个例子说明如何用回调来处理异步：

//错误的写法：
function getData (){
// 模拟请求数据
var result='';
setTimeout(function(){
result='这是请求到的数据'
},200);
return result;
}
console.log( getData ()); /* 异步导致请求不到数据 */

// 正确的处理异步 ：
function getData (callback){
// 模拟请求数据
var result='';
setTimeout (function(){
result='这是请求到的数据';
callback(result);
},200);
}
getData (function( data ){
console.log(data);
});

接下来我们来改造我们的代码：

exports.getMime=function(fs,extname,callback){  /*获取后缀名的方法*/

fs.readFile('./mime.json',function(err,data){

if(err){
console.log('mime.json文件不存在');
return false;
}
//console.log(data.toString());

var Mimes=JSON.parse(data.toString());

var result= Mimes[extname] || 'text/html';

callback(result)

});

}

//引入http模块
var http=require('http');

//fs模块

var fs = require('fs');

//path模块
var path = require('path');  /*nodejs自带的模块*/

//url模块

var url = require('url');

//引入扩展名的方法是在文件里面获取到的。

var mimeModel = require('./model/getmimefromfile.js');

//console.log(mimeModel.getMime('.css'));   //获取文件类型

http.createServer(function(req,res){

//http://localhost:8001/news.html    /news.html
//http://localhost:8001/index.html    /index.html

//css/dmb.bottom.css

//xxx.json?214214124

var pathname = url.parse(req.url).pathname;

console.log(pathname);

if(pathname == '/'){
pathname = '/index.html'; /*默认加载的首页*/
}

//获取文件的后缀名
var extname = path.extname(pathname);

if(pathname != '/favicon.ico'){  /*过滤请求favicon.ico*/
//console.log(pathname);
//文件操作获取 static下面的index.html

fs.readFile('static/' + pathname,function(err,data){

if(err){  /*没有这个文件*/

console.log('404');

fs.readFile('static/404.html',function(error,data404){
if(error){
console.log(error);
}
res.writeHead(404,{"Content-Type":"text/html;charset='utf-8'"});
res.write(data404);
res.end(); /*结束响应*/
})

}else{ /*返回这个文件*/

var mime = mimeModel.getMime(fs,extname,function(mime){
res.writeHead(200,{"Content-Type":"" + mime + ";charset='utf-8'"});
res.write(data);
res.end(); /*结束响应*/
});
}
})

}

}).listen(8001);

我们继续访问我们的index.html：





现在我们一个静态web服务就创建好了，能够成功的加载各种静态资源了。