使用 Logto 在 Expo (React Native) 中建立身份驗證
學習如何通過整合 Logto SDK,在 Expo (React Native) 中建立用戶身份驗證流程。
學習如何通過整合 Logto SDK,在 Expo (React Native) 中建立用戶身份驗證流程。
在本教程中,我們將向你展示如何通過整合 Logto SDK 來使用 Expo (React Native) 構建使用者身份驗證流程。教程使用 TypeScript 作為程式語言。
在開始之前,請確保你具備以下條件:
要開始,請創建一個類型為 "Native" 的 Logto 應用程式。按照以下步驟創建 Logto 應用程式:
然後你應該會看到一個互動指南,指導你如何將 Logto SDK 整合到你的 Expo (React Native) 應用程式中。以下內容可以作為未來的參考。
通過你喜愛的套件管理器安裝 Logto SDK 和對等依賴項:
@logto/rn 套件是 Logto 的 SDK。其餘的套件是它的對等依賴項。由於 Expo CLI 需要在根項目的 package.json 中直接安裝所有原生模組的依賴項,所以它們不能列為直接依賴項。
引入並使用 LogtoProvider 來提供 Logto 的上下文:
切換到 Logto 控制台的應用程序詳情頁面。添加一個原生的重定向 URI(例如:io.logto://callback),然後點擊“保存”。
對於 iOS,重定向 URI 的方案並不重要,因為 ASWebAuthenticationSession 類將會監聽重定向 URI,不論是否已註冊。
對於 Android,重定向 URI 的方案必須填入 Expo 的 app.json 文件,例如:
現在回到你的應用程序,你可以使用 useLogto 鉤子進行登入和登出:
要顯示用戶資訊,可以使用 getIdTokenClaims() 方法:
現在你可以運行應用程式並嘗試使用 Logto 登入/登出:
如果在整合過程中遇到任何問題,請隨時 加入我們的 Discord 伺服器 與社群和 Logto 團隊聊天!