发布时间：2025 年 6 月 6 日
了解 Chrome 新提议的 <permission> 元素如何打造更精简、更值得信赖且更贴合情境的权限体验。
Chrome 团队设计了 <permission> 元素提案，旨在让用户掌控强大的功能。该元素使开发者能够创建无缝的端到端体验，让用户可以在上下文中允许使用这些功能，同时避免用户受到不必要的干扰。以下一系列使用情形研究展示了新元素在实践中的运作方式。
请求权限的问题
为了使用位置信息、摄像头或麦克风等设备功能，用户通常需要应对可能出现的多次权限请求，这令人感到沮丧。对于开发者来说，调用 API 来使用某项功能非常简单，结果要么成功，要么失败。但对于用户而言，这通常意味着会收到干扰性强且不合时宜的提示，以及看似最终的决定，从而导致用户感到沮丧并增加认知负荷。
如今，权限提示经常会让用户感到疑惑：“为什么此网站（现在）需要此权限？”这种不清晰的情况往往会导致用户选择拒绝权限请求。为了避免日后打扰用户，Chrome 随后会阻止进一步的提示，这反过来会导致一个相反的难题：如果用户日后改变主意，则需要撤消这些拒绝操作。 这可能会导致用户放弃使用相应功能或完全放弃访问该网站。
为用户提供情境控制
拟议的 <permission> 元素代表着 Web 权限在人体工程学方面的重大演变。借助此提议的 HTML 元素，您可以将可设置样式的浏览器控制入口点无缝集成到网站设计中，以便直接使用强大的功能（例如，视频聊天中的“使用相机”按钮）。在您享受样式灵活性的同时，浏览器会继续控制核心文本和图标，并负责处理安全性、一致性和无障碍性。这意味着与此元素的互动可清晰表明用户的意图，从而使浏览器能够帮助用户做出必要的决定并完成其他步骤。这与以程序化方式触发的提示形成对比，后者由于浏览器缺乏用户意图的直接信号，因此必须始终在提供帮助和不打扰用户之间保持平衡。
<permission> 元素的示例实现。
以下是它如何改变体验：
- 用户发起：该元素通过设计确保用户在想要使用相关功能时选择该元素，而不是由网站发起提示。
- 情境化请求：由于建议的
<permission>元素是网站流程的一部分，因此用户了解需要此权限的原因。他们点击了某个按钮（例如，查找附近的商店），因此位置信息请求是合理的。 - 全面的问题排查：由于浏览器会直接收到有关用户意图的信号，因此可以主动引导用户完成访问功能所需的所有平台特定步骤。例如，它可以深层链接到系统设置，帮助用户更改设备级相机设置，而网站无需提供平台相关的问题排查步骤。
- 简化的权限恢复：建议的
<permission>元素可让用户直接在网页中更改之前被拒绝的权限，而无需进入浏览器设置。点击该元素会触发特殊版本的权限提示，从而大幅提升恢复效果。
<permission> 元素，用户无需前往网站设置即可快速更改权限设置。
这种方法可实现更直观、更值得信赖、更以用户为中心的互动模式。
案例研究
Zoom 通过 <permission> 元素将浏览器中的摄像头和麦克风捕获错误减少了 46.9%，从而帮助用户
挑战
对于会议网站来说，最大的挑战之一是帮助之前拒绝授予摄像头或麦克风使用权限的用户在加入视频通话时重新启用这些权限。标准流程要求在会议网站界面之外浏览浏览器设置。
采用的方法
Zoom 针对 <permission> 元素的影响所采用的测试方法是进行前后比较，其中 <permission> 元素面向所有通过桌面版 Chrome 网络浏览器加入 Zoom 会议的 Zoom 用户。
结果
Zoom 的一项关键指标是摄像头和麦克风捕获率，用于衡量用户在浏览器中加入 Zoom 会议时成功启用摄像头和麦克风的次数。Zoom 在使用 <permission> 元素后，性能得到了显著提升。浏览器体验方面的故障（例如麦克风和摄像头未在系统级或浏览器级启用，或者用户关闭了浏览器麦克风和摄像头权限提示）减少了 46.9%。
<permission> 元素不仅有助于减少错误，还可帮助最初遇到问题或错误地拒绝访问权限的用户恢复和配置麦克风和摄像头，从而让用户专注于对话和会议，确保每个人都能清楚地看到和听到对方的声音。
Immobiliare.it 如何通过使用 <permission> 元素，在之前被拒绝权限的情况下帮助用户使用地图位置信息功能
挑战
之前在 Immobiliare.it 网站上拒绝分享位置信息的网站权限的用户，必须访问浏览器的“网站设置”，手动解锁权限，才能在需要时再次授予位置信息权限。
采用的方法
Immobiliare.it 使用 Permissions API JavaScript 方法检测用户是否已向其网站授予位置信息权限，从而改进了位置信息权限请求流程。如果他们已共享权限，则会导致像之前一样请求地理定位 getCurrentPosition() 方法。如果 Permission API 返回用户已屏蔽位置信息权限，网站会显示一条提示，说明“地理定位”按钮无法正常工作，并使用 <permission> 元素作为号召性用语。
通过点击“使用位置信息”<permission> 元素，用户可以顺畅地分享位置信息权限（如果需要），即使之前已屏蔽位置信息权限，也无需用户访问浏览器设置。
<permission> 元素的消息传递用户体验（如果之前已屏蔽权限）。<permission> 元素触发了浏览器权限提示。成果
使用 <permission> 元素后，地理定位权限用户流程的成功率提高了 20%，这表明使用 Permissions API 和 <permission> 元素的新权限流程有助于更多用户在需要时再次允许该权限，即使他们过去曾阻止此类权限请求也是如此
ZapImóveis (OLX BR) 通过 <permission> 元素增强了预期用途的位置搜索功能
ZapImóveis 是巴西领先的房地产平台，深知寻找理想房产往往从位置开始。ZapImoveis 是著名的 Grupo OLX 的一部分，可将数百万用户与巴西各地待售和待租的房屋、公寓、土地和其他房产联系起来。 ZapImóveis 意识到基于位置信息的搜索在此过程中发挥着至关重要的作用，因此发现了一个机会，即通过解决与浏览器权限提示相关的常见问题来提升用户体验。
挑战
ZapImóveis 发现其位置搜索功能存在严重易用性问题，尤其是与标准浏览器权限提示相关的问题。用户在首次授予位置信息访问权限时遇到了困难，或许更严重的是，在之前拒绝过位置信息访问权限后，他们尝试重新启用该权限时也遇到了困难。这会对整体用户体验产生负面影响，并可能会阻碍其网站上基于位置的搜索功能的有效性。
采用的方法
为了解决这些易用性问题，ZapImóveis 开展了一项 A/B 测试。在此测试中，我们向部分用户推出了 <permission> 元素。我们的目标是在 ZapImóveis 界面中提供一个专用的网页内控件，用于管理位置信息权限，从而简化权限工作流程并使用户能够更直观地操作。
成果
ZapImóveis 的 <permission> 元素的实现显著提高了位置搜索的易用性，尤其是对于积极使用基于位置的功能的用户。对于最初在标准浏览器权限提示方面遇到困难的用户，<permission> 元素提供的网页内控件使 4.3% 的用户成功授予了位置信息访问权限。此外，它还显著增强了权限恢复功能，之前拒绝过访问权限的用户中，有 54.4% 在后来尝试使用依赖于位置信息的功能时成功重新授予了权限。虽然首次授予权限的平均时间略有增加，但对于意图明确的用户，功能成功率的大幅提高证明了这种权衡取舍是合理的。
查看更多 <permission> 元素的实际应用示例
- 使用 Chrome 浏览器在 Google Meet 中发起视频会议通话。
- 在 Google 搜索中搜索附近的餐厅（逐步推出）
- 在 https://permission.site/pepc（自 Chrome 137 起）上测试
<permission>元素的所有可用功能
集成 <permission> 元素
<permission> 元素旨在让开发团队能够轻松采用。作为常规 HTML 元素，它可以像任何其他按钮一样集成，并且可以（在浏览器控制的范围内）设置样式，以匹配您网站的外观和风格。对于尚不支持 <permission> 元素的浏览器，开发者可以使用现有的权限请求方法提供回退体验。如需了解详情，请参阅对 <permission> 元素的增强。
让网络更实用、更直观
Google 一直致力于让 Chrome 和 Web 平台更安全、更快速、更实用。<permission> 元素代表着我们在打造更直观、更符合人体工程学的 Web 权限模型方面迈出了重要一步。通过为用户提供清晰的上下文和控制权，<permission> 元素有助于弥合强大的 Web 功能与用户信任之间的差距，从而在整个 Web 上实现更丰富、更具吸引力的体验。我们鼓励产品负责人和开发团队探索如何利用 <permission> 元素来改善用户体验，并充分发挥 Web 应用的潜力。