安装需要什么条件?

渐进式 Web 应用 (PWA) 是使用 Web 技术构建的现代、高质量的应用程序。PWA 提供与 iOS/Android/桌面应用类似的功能,即使在不稳定的网络条件下也可靠,并且可安装,从而使用户更容易找到和使用它们。

大多数用户都熟悉应用程序的安装,以及安装体验的好处。已安装的应用程序会出现在操作系统启动界面上,例如 Mac OS X 上的“应用程序”文件夹、Windows 上的“开始”菜单以及 Android 和 iOS 上的主屏幕。已安装的应用程序还会显示在活动切换器、设备搜索引擎(如 Spotlight)和内容共享表单中。

当您的渐进式 Web 应用 (PWA) 满足某些条件时,大多数浏览器都会向用户指示它是可安装的。示例指示器包括地址栏中的“安装”按钮或溢出菜单中的“安装”菜单项。

Screenshot of omnibox with install indicator visible.
浏览器提供的安装推广(桌面版)
Screenshot of browser provided install promotion.
浏览器提供的安装推广(移动版)

此外,当满足条件时,许多浏览器会触发 beforeinstallprompt 事件,允许您提供自定义的应用内用户体验,从而在您的应用内触发安装流程。

安装条件

在 Chrome 中,您的渐进式 Web 应用必须满足以下条件,然后才会触发 beforeinstallprompt 事件并显示浏览器内安装推广

  • Web 应用尚未安装
  • 满足用户互动启发法
    • 用户需要在页面上至少点击或轻触一次(在任何时候,甚至在之前的页面加载期间)
    • 用户需要至少花费 30 秒查看页面(在任何时候)
  • 通过 HTTPS 提供服务
  • 包含一个Web 应用清单,其中包含
    • short_namename
    • icons - 必须包含 192px 和 512px 图标
    • start_url
    • display - 必须是 fullscreenstandaloneminimal-uiwindow-controls-overlay 之一
    • prefer_related_applications 不得存在,或为 false

其他浏览器也有类似的安装条件,尽管可能存在细微差异。请查看各自的站点以获取完整详细信息