iT邦幫忙

0

Day 19 | 登入功能第一步:認識Session與JWT,建立使用者資料表

  • 分享至 

  • xImage
  •  

前面十八天,所有人看到的都是同一份待辦清單。從今天開始做登入系統,讓每個人只管理自己的資料。

今天做的事
HTTP是無狀態的,伺服器不會記得誰登入過,所以每次請求都要出示身分證明。比較兩種做法後,我選了JWT:Session存在伺服器記憶體,重啟就消失;JWT是簽名過的token,由瀏覽器保管,伺服器只要驗證簽名,部署到會隨時重啟的免費主機也不受影響。
安裝bcryptjs(密碼雜湊)和jsonwebtoken,並在db.js新增使用者資料表,待辦事項表多一個user_id欄位:

db.run(`
  CREATE TABLE IF NOT EXISTS users (
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    username TEXT NOT NULL UNIQUE,
    password_hash TEXT NOT NULL
  )
`);

因為資料表結構變了,跟第十二天一樣刪掉舊的todos.db重建。

觀察

  • 在終端機直接測試bcrypt,輸出是$2b$10$FeX9TXqGJk... 這種格式,10是運算強度,完全看不出原本的密碼。bcrypt每次都會加入隨機的salt,所以同一個密碼每次雜湊的結果都不同
  • 測試JWT時,不用密鑰也能解出內容{ id: 1, iat: ... }。token只是編碼,不是加密,所以絕對不能把密碼放進 token
  • 選bcryptjs而不是bcrypt,是因為前者是純JavaScript,可以避開第九天那種需要編譯的原生模組問題

卡關
資料表改完、重啟之後,網頁變成空的,統計全是0,我一度以為自己把什麼改壞了。後來才想到,新版db.js刻意拿掉了初始測試資料,加上我又刪掉重建了todos.db,空的資料表算出來當然是0。

心得
今天沒有新功能可以點,但這是整個登入系統的地基。讓我印象最深的是token的內容誰都看得到,安全不是靠藏起來,而是靠簽名。


圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言