day05

上一篇

接著上一篇完善路由

一、創建資料模型

作用：統一規定回傳資料到客戶端時，資料的格式保存一致

• 在src檔案下創建model檔案夾并在其目錄下創建resModel.js檔案

class BaseModel {
    /*
     data是回傳到客戶端的資料（物件型別），message是錯誤資訊（字串型別）
     如果errno=0，請求成功   通過data來獲取資料
     如果errno=-1，請求失敗 通過message來獲取錯誤的具體原因
    */
    constructor(data, message) {
        //兼容（第一個引數（data）沒有傳遞，只傳遞第二個引數）
        if (typeof data === 'string'){
            //將錯誤資訊賦值給了message
            this.message = data
            data = null
            message = null
        }
        //賦值
        if (data) {
            this.data = data
        }
        if(message) {
            this.message = message
        }
    }
}

//請求成功
class SuccessModel extends BaseModel {
    constructor(data,message) {
        super(data, message)
        this.errno = 0
    }
}

//請求失敗
class ErrorModel extends BaseModel {
    constructor(data, message) {
        super(data, message)
        this.errno = -1
    }
}

module.exports={
    SuccessModel,
    ErrorModel
}

二、優化查看博客串列

• 完善app.js檔案（獲取get引數）

//在原有代碼基礎上添加下面代碼

//獲取get引數 （查看博客串列時需要作者author和keyword）
const querystring = require('querystring')
//將引數存放在req中的物件query中
req.query = querystring.parse(url.split('?')[1])

• 在src目錄下創建controller檔案夾，并創建blog.js檔案
  原由：controller檔案夾是用來存放控制獲取資料的檔案

// src/controller/blog.js

const getList = (author,keyword) => {
    //先回傳假資料（格式正確）
    return [
        {
            id:1,
            title:'標題A',
            content:'內容A',
            createTime:1546610491112,
            author:'zhangsan'
        },
        {
            id:2,
            title:'標題B',
            content:'內容B',
            createTime:1546610524373,
            author:'lisi'
        }
    ]
}

module.exports = {
    getList
}

• 完善獲取博客串列的路由

// src/router/blog.js
const {getList} = require('../controller/blog.js')
const {SuccessModel,ErrorModel} = require('../model/resModel.js')

if (method === "GET" && req.path === "/api/blog/list") {
        //獲取請求資料 （req.query已經在app.js檔案中已經保存好了）
        const author = req.query.author || ''
        const keyword = req.query.keyword || ''
 
        //去請求博客串列資料
        const listData = getList(author,keyword)
        
        return new SuccessModel(listData)
    }

• 測驗
  

三、優化獲取博客詳情

• 在controller檔案夾中的blog.js檔案完善代碼

const getDetail = (id) => {
     //先回傳假資料（格式正確）
    return [
        {
            id:1,
            title:'標題A',
            content:'內容A',
            createTime:1546610491112,
            author:'zhangsan'
        }
    ]
}
//在將方法其匯出

• 完善獲取博客詳情的路由

// src/router/blog.js
if (method === "GET" && req.path === "/api/blog/detail") {
     const id = req.query.id || ''
     //去請求資料
     const detail = getDetail(id)
     return new SuccessModel(detail)
 }

• 測驗
  

接下來是解決post請求，但這里有一個小問題就是post發送的資料在服務端讀取的時候是異步的，例外需要對其進行修改成同步的，具體解決方法點擊這里

四、優化讀取post data資料（Promise）

// app.js 重新創建一個函式用于處理post資料

const getPostData = (req) => {
   const promise =new Promise((resolve, reject) => {
      if(req.method !== "POST") {
         resolve({})
         return
      }
      if(req.headers['content-type'] !== 'application/json') {
         resolve({})
         return
      }
      //接收資料
      let postData=""
      req.on("data", chunk =>{
         postData += chunk.toString()
      })
      req.on('end', chunk => {
           if(!postData) {
              resolve({})
              return
           }
           resolve(JSON.parse(postData))
      })
   })
   return promise
}

在app.js中的serverHandle函式呼叫該函式（先呼叫該函式，在進行路由轉發）

getPostData(req).then(postData => {
      req.body = postData

      //處理 blog 路由
      const blogData = handleBlogRouter(req, res)
      if (blogData) {
         res.end(
            JSON.stringify(blogData)
         )
         return
      }

      //處理user路由
      const userData = handleUserRouter(req, res)
      if (userData) {
         res.end(
            JSON.stringify(userData)
         )
         return
      }

      //未命中路由，回傳404
      res.writeHead(404, { "Content-type": "text/plain" })
      res.write("404 Not Found\n")
      res.end()
   })

五、優化新建博客和更新博客

• 在controller檔案夾中的blog.js檔案完善代碼

const newBlog = (blogData ={}) => {
    //blogData 是一個博客物件，包含 title content 屬性
    
    return {
        id:3 //表示新建博客，插入到資料庫表里面的id
    }
}
//在將方法其匯出

• 完善新建博客的路由

  //新增一篇博客
    if (method === "POST" && req.path === "/api/blog/new") {
        //獲取post請求資料 (app.js中已經獲取到了)
        const postData = req.body
        const id = newBlog(postData)
        return new SuccessModel(id)
    }

• 新增功能測驗
  

接下來是更新功能，因為更新功能需要博客的id并且是該引數是添加在url中的，而前面的獲取博客詳情也是添加在url中，故可以在handleBlogRouter全域下去獲取博客id

• 在controller檔案夾中的blog.js檔案完善代碼

const updateBlog = (id,blogData ={}) => {
    //id 就是要更新博客的 id
    //blogData 是一個博客物件，包含 title content 屬性

    return true
} 
//在將方法其匯出

• 完善更新博客的路由

 //更新一篇博客
    if (method === "POST" && req.path === "/api/blog/update") {
         //獲取post請求資料 (app.js中已經獲取到了)
         const postData = req.body
         const result = updateBlog(id, postData)
         if(result) {
             return new SuccessModel(result)
         }
         return new ErrorModel('更新博客失敗')
    }

• 更新功能測驗
  

六、優化洗掉博客和登錄

• 在controller檔案夾中的blog.js檔案完善代碼

const delBlog = (id) => {
    //id 就是要洗掉博客的 id
     
    return true
}
//在將方法其匯出 

• 完善洗掉博客的路由

 //洗掉一篇博客
    if (req.method === "POST" && req.path === "/api/blog/del") {
       const result = delBlog(id)
       if (result) {
           return new SuccessModel(result)
       } 
       return new ErrorModel('洗掉博客失敗')
    }

• 在controller檔案夾中的user.js檔案完善代碼

const loginCheck = (username,password) => {
  //先用假資料
  if (username === 'zhangsan' && password === '123') {
      return true
  }
  return false
}
module.exports = loginCheck

• 完善登錄的路由

// router/user.js
const loginCheck = require('../controller/user')
const { SuccessModel,ErrorModel} = require ('../model/resModel')
const handleUserRouter = (req, res) => {
    const method = req.method
    //登錄
    if (method === "POST" && req.path === "/api/user/login") {
        const postData = req.body
        const {username,password} = postData
        const result =loginCheck(username,password)
        if (result) {
            return new SuccessModel(result)
        }
        return new ErrorModel('登錄失敗')
       
    }
}
module.exports = handleUserRouter

• 登錄測驗