[程序员] 构建一个漂亮的跨平台登录 / 注册能有多难?


原文地址

开场

作为开发者,你一般如何在 app 中构建用户登录 / 注册?回到 20 年前,大部分答案应该是「从头开始」。这件事曾很简单:

  • 使用 FrontPage 2000 绘制用户名和密码输入控件与提交按钮。
  • 使用语言内置的 Session 将用户会话存储在内存中。
  • 关于安全? MD5 就是答案。

上面的都没听过?那么很遗憾,你错过了软件开发的「好时光」。😁 如今,开发者在构建登录注册时会面临一系列挑战:

挑战

🤦 等一下,等一下。所有这些都只是关于用户登录 / 注册?没有它们,我甚至无法开始「真正的业务」? UI 逻辑看起来很复杂,我是不是还需要 PM 和设计师?答案是:对也不对。容我解释一番:

  • ,因为:

    • 你不仅要构建一个「登录 UI 」,还要构建一个统一的用户身份体系,并支持多种登录方式和身份来源。
    • 当你或你的公司成长到一定规模,或者想要一个优雅且安全的身份用户体验时,你会发现这些东西是必要且基本的。你会很庆幸(或者很后悔没有去)从第一天开始考虑这些事情。
  • 不对,因为在现实生活中这些是几个月的工作;且通常情况下,在项目开始并不需要上述所有功能或特性:例如只从 iOS 应用开始,并且将社交登录作为唯一的登录方式。但是将来在以下状态中进行重构将引发巨大的痛苦:

    • 应用积攒了大量用户数据。
    • 你在开发一个新应用并希望复用同一个用户身份体系。

假设你正在构建一个 all-in-one 的工作台应用(例如 Notion ),嘿,以上任意一件事是否和业务相关呢?

Life is short

我喜欢编码,我能准确地感受到「在项目早期的就停滞不切」那种糟糕的心情。如果你是独立开发者,你还会发现登录和身份这件事在不断重复:几乎每个应用程序都需要它。

我尝试过的

  • Keycloak 功能全面,但对我来说有点「老派」并远远不到开箱即用的程度。
  • Ory 看起来很酷。但是它没有可配置的跨平台 UI 。
  • Supertokens 是一颗冉冉升起的新星,但它必须注入到后端服务中。
  • Auth0 是该领域中一个成熟的大型 SaaS ,但我很难弄清楚如何将 UI 设置成我想要的样子,例如将社交登录作为主要登录方式。

所以,现在是「让我们做点什么」的时间了。

我构建的

伴随着「我为什么要再次处理这个问题?」的项目,我开始和几个开发者朋友一起构建开源项目 Logto。现在我可以自豪地说,Logto 会处理好之前提到的大部分事情。:-)

Logto

帮助你在几分钟内建立登录、auth 和用户身份体系。它提供基于 OIDC 的身份服务,并支持用户名、手机号、邮件和社交登录。还有适用于网页和原生应用的一整套 UI 。

Talk is cheap. 让我通过一个真实的例子来告诉你它是多么简单。

注:篇幅所限,在此就不完全展开所有配置过程了。总结一句话:点点鼠标,几行代码。详细教程可以 阅读原文 或者在 项目文档 网站查看。

在应用中集成 Logto

通过 开始上手 教程启动 Logto 后,按照集成指南,只需要四个简单的步骤就能将 Logto SDK 与你的应用集成。Logto 还会生成可用的代码片段,可以直接复制和测试。没有什么困难和特别的。

集成 Logto

自定义登录体验

下图是登录体验的配置界面:可以将品牌颜色和 Logo URL 换成你的;如果需要,还可以启用深色模式或添加标语;右侧还有实时预览可供查看。这一切都会在全平台生效,也就是说不管是桌面网页、移动网页还是原生应用,都可以拥有相同的登录 / 注册体验。

登录配置

总结

至此,我们已经通过集成 Logto 消除了大多数令人头疼的问题:

  • 「用户界面」实现带有用户名和密码的网页登录 / 注册界面。
  • 「跨平台」跨桌面网页、移动网页和原生应用的统一登录体验。
  • 「身份服务」使用 Logto 服务作为身份的枢纽。
  • 「安全」 Logto 采取了许多开放标准,并有内部安全策略。

Logto 还内置了对其他文章中未涵盖功能的支持:

  • 手机 / 邮件动态验证码登录
  • 社交登录(微信、支付宝、GitHub 等)
  • iOS / Android 应用集成
  • API 保护等

并即将推出这些功能:

  • 忘记密码流程
  • Machine-to-machine 应用
  • 更多连接器和 SDK

所以构建一个漂亮的跨平台登录 / 注册并没有你想象的那么难,对吧?😊

最后,我们希望这篇文章能对你有所帮助。如果对 Logto 的感兴趣,请前往我们的 GitHub repo 继续旅程,并随时和我们交流~

发表回复

您的电子邮箱地址不会被公开。