上一篇我們知道如何用url來返回不同的數(shù)據(jù)，本篇我們來看一下如何返回一個頁面吧。

前置知識：對文件進行操作，讀取，寫入需要用到一個node.js模塊，fs文件操作模塊 。
fs模塊中有一個讀取文件的方法readFile()，里面?zhèn)鲀蓚€參數(shù)，一個是err（錯誤），另一個是data（數(shù)據(jù)）

為了方便，我以下代碼的頁面是我js練習的頁面

//引入http模板和fs模板
var http = require('http')
var fs = require('fs')

//實例化http
var app = http.createServer(function(req, res){
    //編碼解析
    res.setHeader('Content-Type', 'text/html; charset=utf-8')
   
    //定義urls為請求的url地址
    var urls = req.url
    //如果地址為/返回Tab選項卡自動切換頁面
    if( urls === '/' ){
        //讀取文件，第一個參數(shù)是路徑，第二個參數(shù)是編碼類型，第三個是回調(diào)函數(shù)
        fs.readFile("../js練習/Tab選項卡自動切換.html", 'utf-8', function(err, data){
            //！err err是錯誤時返回，！err取反表示沒有錯誤，即成功時
            if(!err){
                res.end(data)   //返回頁面數(shù)據(jù)
            }else{
                console.log("讀取文件失敗")
            }
        })
    } else if( urls === '/page1' ){
        fs.readFile("../js練習/QQ抖動效果.html", 'utf-8', function(err, data){
            if(!err){
                res.end(data)
            }else{
                console.log("讀取文件失敗")
            }
        })
    } else if( urls === '/page2' ){
        fs.readFile("../js練習/創(chuàng)建和添加元素.html", 'utf-8', function(err, data){
            if(!err){
                res.end(data)
            }else{
                console.log("讀取文件失敗")
            }
        })
    } else{
        res.end("404")  //沒找到url地址時
    }

})

app.listen(3000, function(){
    console.log("服務(wù)器啟動成功，瀏覽器地址：http://127.0.0.1:3000/")
})

效果圖

image.png

image.png

image.png