启用快速登录：即时界面模式用户体验模式

Eiji Kitamura

发布时间：2026 年 9 月 30 日

概览

即时界面模式可解决因导航到专用登录页面而导致的情境丢失和用户流失问题。它支持快速登录，让用户无需离开当前查看或处理的页面，即可使用通行密钥或已保存的密码完成登录。

与 Conditional UI（在用户聚焦文本输入字段时显示自动填充建议）不同，Immediate UI 模式会在用户点击按钮或链接时立即调用浏览器的身份验证对话框（目前，uiMode 仅接受 "immediate"，但未来可能会发生变化）。

以下三个核心特征使即时界面模式在快速登录方面具有独特的优势：

  • 跳过跨设备二维码：如果设备上存在可立即使用的通行密钥或已保存的密码，浏览器会立即显示身份验证对话框。如果不存在，则立即退出，而不显示智能手机的跨设备二维码界面。 这样一来，您的网站就可以自然地过渡到其正常的后备导航（例如，转到登录页面）。
  • 直观的以账号为中心的身份验证界面：该界面不会单独列出混合类型的凭据，而是隐藏通行密钥和密码之间的底层差异，从而提供直观的账号选择器，让用户专注于自己想要登录的账号。
  • 安全渐进增强：虽然仅在 Google Chrome 和 Chromium 浏览器中受支持，但使用功能检测可让您在受支持的环境中为用户提供快速登录体验，而不会中断不受支持的浏览器（例如 Safari 或 Firefox）或无痕模式下的用户现有的登录流程。

如需详细了解该 API 的底层运作方式以及如何实现功能检测，请参阅登录的即时界面模式。本文档将探讨建议采用的用户体验模式，这些模式可通过即时界面模式提高转化率，同时还会介绍应避免的设计反模式。

使用“立即”界面模式最有效的地方是在网页导航之前的拦截。每当未通过身份验证（或会话过期）的用户点击通常会将其导航到登录页面的链接或操作按钮时，立即调用界面模式会在那一刻创建顺畅的用户体验，绝不会中断用户的工作流程。

大多数网站都会在屏幕顶部的全局标头中放置一个“登录”链接，该链接可将用户引导至专用登录页面。当用户点击正在浏览的网页上的此链接时，暂停导航并调用“立即显示界面”模式可让浏览器在设备上存在凭据的情况下，直接在当前网页上显示账号选择对话框。

用户选择账号并完成身份验证后，系统会就地将标题更新为登录状态，而不会进行任何网页导航，从而让用户无需离开当前浏览的网页即可继续浏览。反之，如果设备上不存在任何凭据，则不会显示任何浏览器界面，用户可以顺利前往登录页面，完全符合其最初的意图。

结账时的动态登录（电子商务）

在电子商务网站上，从购物车到结账的过渡是因网页浏览摩擦而导致弃购的最常见环节之一。 通过在未经过身份验证的买家点击购物车界面上的“继续结账”按钮时立即调用“即时界面”模式，系统会在点击按钮的位置显示账号选择对话框，只需点按一下即可完成身份验证。

身份验证成功后，买家会完全跳过登录页面，直接进入最终的配送和付款确认界面（结账页面），从而大幅减少完成购买所需的步骤。如果不存在任何凭据，买家会正常过渡到常规登录或以访客身份结账选择界面。您可以根据业务需求，将网站设计为允许访客结账或要求用户登录。即时界面模式旨在消除回头客的结账摩擦。

针对微操作（例如“赞”“添加书签”“保存”）的内嵌登录

当访问者浏览社交动态、社区网站或电子商务产品目录时，如果每次他们尝试“赞”帖子或“收藏”商品时，系统都强制将他们重定向到登录页面，可能会导致部分用户放弃该操作。

当未登录的访问者点击“赞”“添加书签”或“保存”等操作按钮时，在原位置显示“立即”界面模式对话框可让系统完成身份验证，并立即触发操作记录和界面动画（例如心形图标变为红色）。滚动位置不会移动单个像素，从而完全保留浏览沉浸感。如果不存在任何凭据，您可以选择在当前屏幕上显示一个轻量级内嵌登录模态框，而不是立即离开，也可以引导用户前往登录页面，以便在登录后返回到原来的位置。

针对敏感操作的升级重新身份验证

即使在用户已登录的情况下，安全最佳实践也要求在执行敏感操作（例如更改密码、更新送货地址、修改已保存的支付方式或添加新的通行密钥）时，在自上次身份验证经过一定时间后，进行增强型重新身份验证。当用户点击链接或按钮前往“我的账号”概览页面上的敏感设置时，系统会调用“立即”界面模式，以便在信息中心内完成身份验证，而无需离开该页面。这样一来，用户无需通过中间的重新登录界面，即可直接前往目标设置编辑页面（或立即执行敏感操作）。如果不存在任何凭据，请将用户转到您的标准重新验证界面（例如密码重新输入界面或一次性密码验证界面）。

虽然从未经身份验证的状态进行标准快速登录时无需指定目标凭据，但在此重新身份验证使用情形中，您必须指定目标凭据。在请求中设置 allowCredentials，以便仅显示属于已登录用户的凭据。

解锁发布商网站付费墙

新闻媒体和内容平台广泛采用一种模式，即文章的开头段落可免费访问，而当读者滚动到文章中途时，系统会显示软性付费墙或会员专用模糊效果。

当读者向下滚动文章，到达付费墙，然后点击“使用您的账号继续阅读”按钮时，调用“立即”界面模式会在读者暂停的确切滚动位置上方显示身份验证对话框。身份验证完成后，文章模糊效果会平稳消失，无需重新加载页面，读者可以继续阅读，而不会丢失他们正在查看的文本行。如果不存在凭据，请展开付费墙部分中的内嵌注册或登录表单。

应避免的反模式

虽然在网页导航之前使用“立即显示界面”模式可带来巨大价值，但如果将其放置在错误的位置，则会严重损害用户的登录体验。

避免在专用登录页面上的登录按钮上使用立即界面模式

由于即时界面模式可在单个精美的对话框中同时处理通行密钥和密码，因此您可能会想在专用登录页面上的“登录”按钮中使用它。不过，您应避免在此处使用它。首先，立即界面模式严格要求用户激活（例如点击或点按），这使得在登录页面上使用该模式显得很尴尬，因为用户可能希望在网页加载时间立即看到登录选项。其次，登录页面是用户在设备上没有本地凭据时到达的最终目的地，也是用户打算通过以下方式登录时到达的最终目的地：在移动设备上使用通行密钥登录（跨设备身份验证），或点击“使用通行密钥登录”来使用硬件安全密钥登录。如果您在此处使用“立即”界面模式，浏览器会抑制跨设备二维码和安全密钥回退，并在发现设备上没有本地凭据时立即终止，从而将用户困在死胡同中，即点击按钮后，页面上没有任何进一步的目的地。

在每个身份验证方法都必须可靠运行的登录页面上，最佳实践是在输入字段上配置条件式界面（自动填充集成），以确保本地通行密钥的便利性，同时将显式的“使用通行密钥登录”按钮与可靠显示跨设备二维码和安全密钥选项的标准调用方法配对。

总结

即时界面模式是一种强大的用户体验工具，可消除前往登录页面的不必要绕行，实现快速登录，在完成登录的同时保留上下文。通过在发生网页导航之前拦截明确的用户意图时刻（例如标头登录链接、结账按钮、微操作、敏感操作的升级重新身份验证（使用 allowCredentials 指定）和文章付费墙），您可以防止用户流失并提供顺畅的用户体验。

同时，请注意，立即界面模式严格来说是一种在网页导航之前的渐进式增强功能；请避免将其应用于最终目标登录页面上的按钮，以便您的设计对跨设备（二维码）用户保持开放和可访问。

如需详细了解如何实现通行密钥和最新的 Web 身份功能，请浏览以下资源：