前言

這四個是很常被一起比較或談論的主題，但實際上這四個並不是類似性質的東西，並不能拿來相提並論。

可是你超常看到別人的文章標題下「What is the difference between Cookie & Session」、「How to use JWT with Local Storage」等等……所以 Cookie 跟 Session 是類似性質的東西？JWT 是什麼？如果我要用 JWT 驗證一定要搭配 local storage 嗎？ ( JWT 驗證又是什麼？)

若你有以上這些疑問，這邊寫一篇超長文章詳解這些專有名詞，一一為你解釋這些東西的作用、適用場合、優缺點比較，甚至有機會的話把實作 Code 放上來。

不論是 Cookies 還是 Session 抑或 JWT，主要功能都是用作資訊傳遞，那資訊傳遞的一個主要目的就是為了驗證 (也就是使用者登入登出這玩意兒)，因此這篇文章的主題也會把「驗證」作為核心討論(但並不僅限於驗證)。

目錄

• What is Authentication & Authorization
  • Return 401 vs Return 403
  • Stateful Authentication vs Stateless Authentication
    • Session Based System
    • Token Based System
    • Comparison & Q&A
• What is Session
  • Feature
  • Security
  • Pros & Cons
• What is JWT
  • Feature
    • Signed, Encrypted, Encoded
  • JWT vs JWE vs JWS
  • Security
  • Pros & Cons
• What is Cookie
  • Store in Client Storage
  • Set in Response, Sent in Request
  • Server Side Cookie? Client Side Cookie?
  • Use Flags — secure, httponly, samesite
  • set domain, path
  • XSS, CSRF
  • Overcome CORS
  • 3rd Party Cookie
  • Cookies in SPA
  • When to use Cookies
• Storage Comparison — Cookie, Local Storage, Session Storage
  • What is Local Storage
    • Security Problem — XSS (3rd party script compromised)
    • When to use
  • What is Session Storage
    • Security Problem — XSS
    • When to use
  • Comparison
• Implement — Which tools should I use — for SPA
• Implement — Which tools should I use — for SSR

資料來源

• 跟 CORS 和 COOKIE 打交道