APP
NodeJS的中文文檔：http://nodejs.cn/api/
fs模塊
fs模塊最重要的一個(gè)功能就是異步讀取文件（readFile），第一個(gè)參數(shù)文件，第二個(gè)參數(shù)是回調(diào)函數(shù)
我們看下面的一個(gè)案例
var http = require("http"); var fs = require("fs"); // 創(chuàng)建服務(wù)器 var server = http.createServer(function(req,res){ fs.readFile("./1.html",function(err,data) { res.end(data) }) }) // 監(jiān)聽(tīng) server.listen(3000,function(){ console.log("監(jiān)聽(tīng)3000端口") })
此時(shí)瀏覽器看到界面
?
?
?其中，data為文件的內(nèi)容
路由
上面的案例，我無(wú)論輸入什么URL都會(huì)顯示這個(gè)頁(yè)面
?
?
?
此時(shí)我們就可以利用這個(gè)特性完成一個(gè)路由設(shè)計(jì)
我們可以通過(guò)req.url得到用戶(hù)輸入的URL的地址
var http = require("http"); var fs = require("fs"); // 創(chuàng)建服務(wù)器 var server = http.createServer(function(req,res){ res.setHeader("Content-type","text/html;charset=utf8"); if(req.url==="/1.html"){ fs.readFile("./1.html",function(err,data){ res.end(data) }) }else if(req.url==="/2.html"){ fs.readFile("./2.html",function(err,data){ res.end(data) }) }else{ res.end("無(wú)頁(yè)面") } }) // 監(jiān)聽(tīng) server.listen(3000,function(){ console.log("監(jiān)聽(tīng)3000端口") })
比如此時(shí)我們?cè)L問(wèn)1.html文件
?
?
?訪問(wèn)2.html文件
?
?
?
通過(guò)路由進(jìn)行頁(yè)面的讀取，這個(gè)就是頂層路由設(shè)計(jì)
頂層路由設(shè)計(jì)：
- 物理文件層次和URL是沒(méi)有任何關(guān)系的
- NodeJS是可以做頂層路由設(shè)計(jì)的！一個(gè)頁(yè)面URL是可以自定義的
- 用戶(hù)的輸入的URL是可以映射任何HTML頁(yè)面的
頂層路由設(shè)計(jì)會(huì)遇到的問(wèn)題
此時(shí)我們?cè)?.html文件中添加一個(gè)圖片
現(xiàn)頁(yè)面中只有文字的展示，沒(méi)有圖片的展示，但是HTML結(jié)構(gòu)中是有img標(biāo)簽的，那么為什么沒(méi)有加載出來(lái)，是因?yàn)樵搱D片的url路徑是沒(méi)有物理文件夾的
我們可以發(fā)現(xiàn)現(xiàn)在這張圖片的真是物理地址是http://127.0.0.1:3000/1.png，但是圖片物理存放地址是在F: ode/1.png，所以一定不能按需加載
解決辦法就是對(duì)每一張圖片進(jìn)行請(qǐng)求
var http = require("http"); var fs = require("fs"); // 創(chuàng)建服務(wù)器 var server = http.createServer(function(req,res){ // 設(shè)置字符集 res.setHeader("Content-Type","text/html;charset=UTF8"); //對(duì)頁(yè)面的內(nèi)容進(jìn)行請(qǐng)求 if(req.url === "/1.html") { fs.readFile("./1.html",function(err,data) { res.end(data) }) //對(duì)頁(yè)面的圖片地址進(jìn)行請(qǐng)求 } else if(req.url=="/1.png"){ res.setHeader("Content-Type","image/jpg"); // 讀取圖片 fs.readFile("./1.png",function(err,data){ res.end(data) }) }else{ res.end("無(wú)頁(yè)面顯示") } }) // 監(jiān)聽(tīng) server.listen(3000,function(){ console.log("監(jiān)聽(tīng)3000端口") })
此時(shí)就可以看到圖片正常加載
?
?
?
需要注意的是使用NodeJS進(jìn)行請(qǐng)求文件的時(shí)候需要設(shè)置對(duì)應(yīng)的ContentType，就是文件的請(qǐng)求類(lèi)型
常見(jiàn)的請(qǐng)求類(lèi)型
text/html:HTML格式
text/css:CSS格式
text/plain:純文本格式
text/xml:XML格式
image/gif:gif圖片格式
image/jpeg:jpg圖片格式
image/png:png圖片格式
res.setHeader("Content-Type","text/html;charset=UTF8") //HTML res.setHeader("Content-Type"," text/css ") //CSS res.setHeader("Content-Type"," image/png ") //png格式的圖片
?
本文摘自 ：https://www.cnblogs.com/
