前言

做了簡易的 OAuth 練習，就順便學了 NestJS (Node)後端框及 Prisma (ORM) 。

目的

開放授權（OAuth）是一個開放標準，廣泛用於社群授權登入，讓第三方網站可以不用取得使用者帳密，就能存取資源服務器資源。

流程圖

流程說明

1.在主網站按下登入按鈕，會透過 URL 將 redirect_uri 傳遞至 OAuth 登入頁面。
2.使用者輸入帳號密碼完成登入後，系統會產生一個 code，並將其存入資料庫，然後將頁面重定向回電商網站的 callback 頁面，並將 code 透過 URL 傳遞過去。
3.在 callback 頁面，前端可以從 URL 中獲取 code，並將其傳送至後端，透過 OAuth API 使用該 code 換取 access token。
4.頁面會取得到的 access token，此時可以使用該 access token 去訪問資源伺服器，取得相關資訊，過期時則可以去換token。

可以做的更好的部份

• 資料庫密碼欄位應該要加嚴處理
• 驗證過程可以加上 client id 及 secret ，更具安全性

此次採用的技術架構是

• 前端(電商網站) - Next.JS(React) - 程式碼
• 後端(OAuth 服務) -( Nest JS + Mysql + Prisma + Swagger + class-validator做資料驗證) - 程式碼

心得

這是我第一次使用 NestJS 撰寫網站，發現它的開發體驗非常友好，NestJS 的模組化設計讓我聯想到 Angular 的依賴注入方式，同時也有點像 .NET MVC 的分層結構，搭配 Prisma，資料庫操作變得非常直觀，對於輕量型網站，NestJS 不僅開發速度快，還能輕鬆實現模組化和關注點分離，讓開發過程更加高效。

參考

• 參考資料1
• 參考資料2