Introduction to JSON Web Token

猴子也能懂的 JWT，不懂有點可惜了

（圖片若無法載入請重新整理幾次看看）

API 的全名是 Application Programming Interface，聽完了還是不懂？

只要注意一個關鍵字：Interface → 連接程式與程式的介面

很像是你在使用電腦時會有一個一個插孔：

所以透過 API 就可以讓 user 端的瀏覽器跟你的伺服器溝通（新增、修改、刪除、查詢資料）

在這邊的例子就是：

💡

browser 要透過一定的規範（菜單不能畫歪）才能讓老闆聽懂客人要點什麼也才能回傳客人點的菜

但問題就來了，每碗滷肉飯都應該要回傳給特定的客人

系統要怎麼辨識哪碗滷肉飯要給誰啊？

💡

會不會有人冒充別人點了一堆滷肉飯然後賴帳？

當使用者登入帳號密碼之後，系統就會核發一個 token 給使用者

這樣當他要執行一些需要確認身份才能做的動作時

不用再登入一次，系統也可以認得使用者是誰

JWT 可以拆分成三個零件，他們分別用兩個 . 去做分隔（見上圖）


{
  "alg": "HS256", // 預設加密方式是 HS256
  "typ": "JWT" // token 型別 （其實就是 JWT 根本廢話哈哈）
}


{
  "sub": "1234567890",
  "name": "John Doe",
  "iat": 1516239022,
	"exp" : 9999999999 // timestamp，設定 token 何時過期

}


HMACSHA256(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
  secret)

有 JWT 真的蠻方便的，在 handle 用戶登入、做一些需要購買權限的問題可以很輕鬆地去解決

通常一狗票人（包含之前我）都會把 token 存放在 localStorage 裏面

但 localStorage 的存取權限太容易拿到了

💡

有心人士或第三方串接服務隨便一個放一個 script 在你的頁面就可以把 token 給偷走 !!

那應該怎麼辦呢？到底應該放在哪裡？

你應該放在 httpOnly cookie