為此,我將以 GOOGLE SignIn 為例。
因此,這是執行此操作的逐步指南:
先建立伺服器端與瀏覽器端supabase客戶端:
伺服器客戶端:
瀏覽器客戶端
現在在登入元件上,在前端:
首先建立generateCodeVerifier() 和generateCodeChallenge() utils 函式
現在為 Google 登入按鈕建立一個函數:
下一步是為 /auth/callback 路由建立 get 請求
我們需要一個程式碼驗證器,因為我們已將其傳遞給回調 URL。這將提供會話,並將令牌儲存在cookie中,以便nextjs的中間件可以存取它們。
現在,您必須更新中間件:
存取令牌並將其傳遞給supabase setsession 函數。
現在在客戶端,使用者登入工作階段後需要更新:
如有任何疑問,請在 Linkedin 上聯絡我:
https://www.linkedin.com/in/mernstack-webdeveloper-reactjs-nextjs/
以上是OAuth-SUPABASE-NEXTJS的詳細內容。更多資訊請關注PHP中文網其他相關文章!