node.js -- 身份認證-有解無憂

請問昨天結束的早是對堆積在了今天嗎，今天還來加個班更博，看在這個毅力的份上能否給億點點推薦，

有個好訊息有個壞訊息，先說壞訊息吧，就是在這么學下去我急需急支糖漿，來回顧回顧前面的知識，這幾天學的太急了，搞得有點推著走的意思，好訊息就是今天的內容是最后最后node的基礎內容了，果然天不負我，整完然后有兩個大案例，做完我就從上次復習那里開始一直復習過來，然后全部不欠賬，就昂首挺胸的走進vue了，等等，這個學完可以進去了吧，

今天的第一個內容說一下web開發模式，今天基本就是講一個身份認證的內容，我們的web開發模式呢分為兩種，一種是服務器渲染模式，就是通過服務器進行一個字串拼接，將html頁面拼接出來，然后直接回傳給客戶端，這樣一來就不需要我們的ajax了，直接給客戶端就可以了，他的優點呢就是前端耗時少，畢竟都給服務器做了還有前端什么事，還有他也有利于seo優化，他的缺點就是占用服務器資源，而且不利于前后端分離開發效率低，

第二個模式：前后端分離的模式，它是依賴于ajax的一個廣泛應用，后端負責撰寫api介面，前端就負責呼叫介面就完事了，他的一個優點就是開發體驗好、畢竟前后端分離，用戶體驗也好，也減輕了服務器的壓力，

但是缺點就是不利于seo的優化，

然后我們進入身份認證、

什么事身份認證？

通過一定的手段對用戶身份進行確認的方式，

服務器渲染開發用的就是session認證，而我們的前后端分離用的就是jwt認證，兩者都各有各的優點誰也不讓誰，

先來說下session吧

首先了解一下http無狀態性，就是指客戶端每次的http請求都是獨立的，連續多個請求間沒有直接關系，服務器也不會主動保留每次http請求狀態（就像收銀員他能記住每個來的客戶是會員嗎？）

突破無狀態限制，

超市突破這種限制的方式就是給每個會員發會員卡是吧，在我們web領域這種方式就是cookie，

cookie，是存盤在用戶瀏覽器一段不超過4kb的字串，它是由name、value以及有效期，安全性，適用范圍的可選屬性組成，在不同的域名下，我們的cookie是各自獨立的，每當客戶端發起請求，會自動把當前域名下的所有cookie發給服務器，注意只是當前域名下，

他的特性就是：自動發送、域名獨立、過期時限、4kb限制

3.1

cookie在身份認證中的作用

當我們客戶端第一次請求服務器的時候，服務器會通過回應頭向客戶端發送一個身份認證的cookie，我們的瀏覽器就會把這個cookie存盤起來，當我們下一次請求的時候，就會直接發送這個cookie也就是前面說的會自動發送，即可證明身份，

要注意我們的cookie是不具有安全性的，瀏覽器還提供了讀寫cookie的api，所以cookie很容易被偽造，就像我們的會員卡也有偽造的一樣，所以不要用cookie存盤重要資料，包括我們jwt也不能存后面會說到，

3.2

那么有沒有方法來提高我們cookie的安全性呢？

那就是session認證，就好比我們的會員卡?刷卡的機制就能破除偽造卡了，

session認證機制：

首先我們的客戶端登錄賬號密碼發送了登錄請求，服務器會開始驗證，當驗證成功后，會將其存盤在服務器的記憶體中，同時通過回應頭回傳一個對應的cookie字串，我們的瀏覽器就會把這個字串保存在當前域名下，當我們再次請求的時候，就會把域名下所有cookie一起發送服務器，服務器就會去找對只對應的cookie匹配成功就能找到你資訊了，然后就認證成功了

3.3

說了這么多怎么來再服務器端使用我們的sesson，首先安裝匯入兩部曲然后還需要配置，注意配置是固定寫法，secret是可以為任意字串的，

配置過后就可以用req.session來訪問session物件了，將我們的一些資料用sessin存盤起來，然后登陸成功又可以通過session取出來，當我們退出登錄還可以，destroy方法清空session，注意只是清空這個賬戶資訊，不會清空別人的資訊，具體代碼如下：

注意看todo也就是我們要做的

// 匯入 express 模塊
const express = require('express')
// 創建 express 的服務器實體
const app = express()

// TODO_01：請配置 Session 中間件
const session = require('express-session')
app.use(session({
  secret : 'mySession',
  resave : 'false',
  saveUninitiallized: 'ture'
}))

// 托管靜態頁面
app.use(express.static('./pages'))
// 決議 POST 提交過來的表單資料
app.use(express.urlencoded({ extended: false }))

// 登錄的 API 介面
app.post('/api/login', (req, res) => {
  // 判斷用戶提交的登錄資訊是否正確
  if (req.body.username !== 'admin' || req.body.password !== '000000') {
    return res.send({ status: 1, msg: '登錄失敗' })
  }

  // TODO_02：請將登錄成功后的用戶資訊，保存到 Session 中
  // 注意只有當上面配置了session之后才能夠使用req.session這個物件
  req.session.user = req.body // 用戶資訊
  req.session.islogin = true // 用戶的登錄狀態


  res.send({ status: 0, msg: '登錄成功' })
})

// 獲取用戶姓名的介面
app.get('/api/username', (req, res) => {
  // TODO_03：請從 Session 中獲取用戶的名稱，回應給客戶端
  // 判斷是否登錄成功
  if(!req.session.islogin) {
    return res.send({status:1, msg:'fail'})
  }
  // 登錄成功即可回應資料
  return res.send({
    status : 0,
    msg : 'success',
    username : [req.session.user.username]
  })
})

// 退出登錄的介面
app.post('/api/logout', (req, res) => {
  // TODO_04：清空 Session 資訊
  req.session.destroy()
  res.send({
    status : 0,
    msg : '退出登錄成功'
  })
})

// 呼叫 app.listen 方法，指定埠號并啟動web服務器
app.listen(80, function () {
  console.log('Express server running at http://127.0.0.1:80')
})

這就是session，然后我們看到下一個認證機制jwt，session需要cookie才能夠實作是吧，但我們的cookie有一個致命問題，不支持跨域，如果涉及到跨域需要配置很大一堆步驟，

JWT目前最流行跨域認證解決方案，

實作原理：首先還是客戶端發起一個請求頭發送賬號密碼，服務器驗證，驗證成功后會經過加密生辰一個token字串然后會給你回傳一個token字串，我們拿到這個token字串會將其存盤在localstorage或者sessionStorage中，當我們再次請求就會通過一個authorization的請求頭將token發送給服務器，服務器拿到token就會將他還原成用戶的資訊物件，然后身份也就認證成功了，

JWT的組成部分是有三部分組成：header，patyload，signature，這個，只是分割作用，我們的真正資訊重在中間的payload前后兩個只是保證token的安全性，

怎么在express中來使用我們的token？

需要安裝兩個包，還需要定義密匙是自己自定義的

第四步生成JWT字串的時候在sign這個方法里面，這個配置有效期是token在規定期限之內能夠拿來驗證的期限；

第五步將jwt轉換為json這個陳述句當中，unless這個陳述句的意思是不需要身份驗證的介面

配置完第五步轉換為json檔案后我們就可以用req.user來獲取資訊了，而這個資訊就是我們第四步把什么轉換為jwt字串的資訊，

最后當我們的token過期或者不合法就會出現錯誤，這個時候要需要一個錯誤中間件

// 匯入 express 模塊
const express = require('express')
// 創建 express 的服務器實體
const app = express()

// TODO_01：安裝并匯入 JWT 相關的兩個包，分別是 jsonwebtoken 和 express-jwt
const jwt = require('jsonwebtoken')
const expressJwt = require('express-jwt')
// 允許跨域資源共享
const cors = require('cors')
app.use(cors())

// 決議 post 表單資料的中間件
const bodyParser = require('body-parser')
const { UnauthorizedError } = require('express-jwt')
const { response } = require('express')
app.use(bodyParser.urlencoded({ extended: false }))

// TODO_02：定義 secret 密鑰，建議將密鑰命名為 secretKey
const secretKey = 'hard hard study day day up'
// TODO_04：注冊將 JWT 字串決議還原成 JSON 物件的中間件
app.use(expressJwt({secret : secretKey, algorithms : ['HS256']}).unless({path : [/^\/api\//]}))
// 登錄介面
app.post('/api/login', function (req, res) {
  // 將 req.body 請求體中的資料，轉存為 userinfo 常量
  const userinfo = req.body
  // 登錄失敗
  if (userinfo.username !== 'admin' || userinfo.password !== '000000') {
    return res.send({
      status: 400,
      message: '登錄失敗！'
    })
  }
  // 登錄成功
  // TODO_03：在登錄成功之后，呼叫 jwt.sign() 方法生成 JWT 字串，并通過 token 屬性發送給客戶端
  // 轉化成token加密檔案
  const tokenStr = jwt.sign({username : userinfo.username, algorithms : ['HS256']}, secretKey, {expiresIn : '1h'})
  res.send({
    status: 200,
    message: '登錄成功！',
    token: tokenStr // 要發送給客戶端的 token 字串
  })
})

// 這是一個有權限的 API 介面
app.get('/admin/getinfo', function (req, res) {
  // TODO_05：使用 req.user 獲取用戶資訊，并使用 data 屬性將用戶資訊發送給客戶端
  
  res.send({
    status: 200,
    message: '獲取用戶資訊成功！',
    data: {username : req.user} // 要發送給客戶端的用戶資訊
  })
})

// TODO_06：使用全域錯誤處理中間件，捕獲決議 JWT 失敗后產生的錯誤
app.use((err, req, res, next) => {
  if (err.name === 'UnauthorizedError') {
    // 這次錯誤是由token決議失敗導致的
    return res.send({status : 401, msg : '無效的token'})
  }else {
    // 其他錯誤
    return res.send({status: 500, msg : '未知的錯誤'})
  }
})
// 呼叫 app.listen 方法，指定埠號并啟動web服務器
app.listen(8888, function () {
  console.log('Express server running at http://127.0.0.1:8888')
})

然后后面會有兩個專案，會把之前所學的node綜合起來，我到時候單獨開個博來說一下吧，還是有一些注意事項的

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/458400.html

標籤：JavaScript

上一篇：初踩坑JS加載與audio介面:點擊頭像開始/暫停背景音樂

下一篇：超酷！！HTML5 Canvas 水流樣式 Loading 影片