當前位置:首頁 > IT技術 > Web編程 > 正文

Node.js的內置功能
2021-10-18 17:48:02

NodeJS的中文文檔:http://nodejs.cn/api/

fs模塊

fs模塊最重要的一個功能就是異步讀取文件(readFile),第一個參數(shù)文件,第二個參數(shù)是回調函數(shù)

我們看下面的一個案例

var http = require("http");
var fs = require("fs");
// 創(chuàng)建服務器
var server = http.createServer(function(req,res){
  fs.readFile("./1.html",function(err,data) {
    res.end(data)
  })
})
// 監(jiān)聽
server.listen(3000,function(){
    console.log("監(jiān)聽3000端口")
})

此時瀏覽器看到界面

?

?

?其中,data為文件的內容

路由

上面的案例,我無論輸入什么URL都會顯示這個頁面

?

?

?

此時我們就可以利用這個特性完成一個路由設計

我們可以通過req.url得到用戶輸入的URL的地址

var http = require("http");
var fs = require("fs");
// 創(chuàng)建服務器
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("無頁面")
    }
})
// 監(jiān)聽
server.listen(3000,function(){
    console.log("監(jiān)聽3000端口")
})

比如此時我們訪問1.html文件

?

?

?訪問2.html文件

?

?

?

通過路由進行頁面的讀取,這個就是頂層路由設計

頂層路由設計:

  • 物理文件層次和URL是沒有任何關系的
  • NodeJS是可以做頂層路由設計的!一個頁面URL是可以自定義的
  • 用戶的輸入的URL是可以映射任何HTML頁面的

頂層路由設計會遇到的問題

此時我們在1.html文件中添加一個圖片

現(xiàn)頁面中只有文字的展示,沒有圖片的展示,但是HTML結構中是有img標簽的,那么為什么沒有加載出來,是因為該圖片的url路徑是沒有物理文件夾的

我們可以發(fā)現(xiàn)現(xiàn)在這張圖片的真是物理地址是http://127.0.0.1:3000/1.png,但是圖片物理存放地址是在F: ode/1.png,所以一定不能按需加載

解決辦法就是對每一張圖片進行請求

var http = require("http");
var fs = require("fs");
// 創(chuàng)建服務器
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=="/1.png"){
      res.setHeader("Content-Type","image/jpg");
      // 讀取圖片
      fs.readFile("./1.png",function(err,data){
        res.end(data)
      })
    }else{
      res.end("無頁面顯示")
    }
  })
  
// 監(jiān)聽
server.listen(3000,function(){
    console.log("監(jiān)聽3000端口")
})

此時就可以看到圖片正常加載

?

?

?

需要注意的是使用NodeJS進行請求文件的時候需要設置對應的ContentType,就是文件的請求類型

常見的請求類型

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/

開通會員,享受整站包年服務立即開通 >