全棧身份認證實作：使用 Next.js、NextAuth.js 和 MongoDB－9. Google OAuth 與 mongoose

結合 Google OAuth 和 mongoose 管理用戶數據。

參考: NextAuth.js (Callbacks)

9–1. 處理 Google OAuth 登入函數

• 在 nextauth-options.ts 中添加回調函數（callbacks function），使用 signIn(), jwt(), session() 回調來管理用戶信息。
• 在 signIn() callback 中處理用戶登入後的信息，在 auth.actions.ts 中新增 signInWithOauth 來管理 OAuth 登入，並檢查用戶是否已存在於資料庫中，避免重複建立。

9–2. 更新 Token 和 Session

• 使用 jwt() 回調來保存用戶信息於 token 中，在 auth.actions.ts 中新增 getUserByEmail 從資料庫中獲取用戶信息。
• 在 session() 回調中將 token 中的用戶信息添加到 session。

程式碼

如果有使用 React Developer Tools 擴充，可以點選 Components 查看 SessionProvider

用戶登入後，session 內容包含 user 信息

單元重點

• nextauth-options.ts 加上 callbacks: signIn(), jwt(), session()，在 jwt callback 被調用時，將用戶資料保存在 token 中，在 session callback 中將 token 中的 user 內容傳遞給瀏覽器。
• 新增 server actions：signInWithOauth、getUserByEmail。

參考資料

NextAuth.js (Callbacks)－https://next-auth.js.org/configuration/callbacks

回到目錄
https://medium.com/p/3d2a3ec1d3b6