繁體中文（香港）
  • auth
  • integration
  • logto
  • protected-app

最快速構建認證系統的方法

使用 Logto 將認證設置時間縮短至不到一小時！含無代碼集成、免費內置電子郵件服務、社交連接的逐步指南，以及一鍵認證流配置，Logto 讓認證變得輕而易舉。

Ran
Ran
Product & Design

為你的產品添加用戶認證系統應該是輕而易舉的，對吧？畢竟，這是一個如此標準的模塊。至少我是這麼想的，而 Logto 團隊致力於讓每個產品都擁有一個安全且適合業務的身份系統。

能夠多快完成？ 那麼，讓我們看看。這裡有一個超快速的低代碼解決方案，專為網頁應用程序設計，非常適合快速測試或直接部署到生產環境。包括平台註冊，整個過程可以在 僅需 1 小時或更快 的時間內完成。不相信嗎？去試試看。

作為一家 AI 工具公司，時間就是金錢，我需要快速啟動以佔領市場。以下是我需要的認證內容：

  • 註冊： 電郵 + 驗證電郵 + 設置密碼
  • 登入： 電郵 + 密碼
  • 忘記密碼： 驗證電郵 + 重置密碼
  • 社交登入： 我們選擇最流行的 Google 登入。

好了，我們開始吧。

步驟 1：創建 Logto 帳戶和租戶

  1. 訪問 cloud.logto.io 並註冊一個 Logto 帳戶。
  2. 直接創建一個生產租戶。免費計劃（50,000 MAU）足以滿足我們的初創公司需求。

創建帳戶和租戶

步驟 2：設置電子郵件連接

連接到我的第三方電子郵件提供商並製作電子郵件模板？哦，等等！Logto 有一個內置的電子郵件服務，不需要配置。

  1. 輸入基本信息：發件人名稱，公司的信息，並上傳電子郵件徽標（都是可選的）。
  2. 測試它：給自己發封電子郵件。華麗的驗證郵件到達了。

設置電子郵件連接

沒錯，整個設置和測試花費不到 5 分鐘！如果你不介意發件人是 “[email protected]”，你可以使用這個免費服務而不需要為不同的場景編寫電子郵件模板。否則，你可以選擇自定義電子郵件提供商。

步驟 3：設置社交連接

不同的產品需要不同的 Google 提供商客戶 ID，所以我需要自己鏈接 Google 連接程序。但是這並不難。

  1. 在 Logto 中填寫 Client ID 和 Client secret，然後啟用 Google One Tap。

設置社交連接

  1. 輸入回調 URL。在 Google API 控制台中選擇 ../auth/userinfo.email、../auth/userinfo.profile 和 openid。

設置谷歌 API 控制台

感謝 Logto 的逐步指南，我不到 10 分鐘就完成了設置。

步驟 4：設置登入體驗

配置好提供商資源後，是時候設置登錄和註冊體驗了。

  1. 導航到“登入體驗”部分：
    • 上傳你的應用程序徽標和圖標。
    • 替換品牌顏色。
    • 一鍵啟用黑暗模式並填寫相同的字段。
  2. 前往“註冊和登錄”選項卡更改認證方法：
    • 設置“電子郵件地址”為註冊標識符，並勾選“創建你的密碼”和“在註冊時驗證”。
    • 設置“電子郵件地址”和“密碼”為登入標識符和認證因素。
    • 添加“Google”作為社交登錄。

設置登入體驗

方便的是，默認設置正是我所需要的，因此這並不耗時。

步驟 5：無需 SDK 集成網頁應用

為何浪費時間集成服務？使用 Logto 的受保護應用程序來代理我的應用請求。

  1. 創建受保護應用： 輸入我的應用程序的 original URL（未經認證保護，任何人都可以訪問）。 使用“.protected.app”後綴設置 app domain 以便測試（該網站地址提供給用戶訪問你的網站，但已配置了身份驗證流程，因此名為“受保護應用程序”）。

    創建受保護應用

  2. 創建應用程序後，訪問此測試地址 acme.protected.app（👈 你也可以試試！）。要求身份驗證以訪問此網站。測試成功。

    登入體驗

  3. 將此網站的真實域名配置為生產，替代默認的“.protected.app”。

  4. 可選：如果你只想對特定路由使用認證，可以添加“自定義認證規則”。默認情況下，整個網站受到保護。

  5. 可以將認證路由 /register、/sign-in、/sign-in-callback 和 /sign-out 直接添加到“開始”和“登錄”、“登出”等按鈕中。

  6. 最後但同樣重要的是，使用 HTTP 基本認證來保護你的原始服務器以完成這個代理集成。每個從受保護應用程序發出的請求都包含以下標頭：Authorization: Basic base64(appId:appSecret)。

就是這樣！短短一小時內，我的網站就被認證保護了。

結論

你可以自信地使用這個超快速的解決方案來保護你的網站。隨著你的產品增長，強大而全面的 Logto 系統允許你無縫升級到多應用支持、MFA、SSO、第三方應用授權、RBAC、多租戶組織等功能，並且可以集成到所有類型的框架中，以增強資源保護和用戶管理。

我邀請你親身體驗，迅速為你的網站配備認證保護。

免費試用 Logto Cloud

更多關於快速認證集成的資訊，請在我們的 Roadmap 上提供反饋或直接聯繫我們。不要忘了加入我們的 Discord 社區與 Logto 團隊交流。

集成愉快！