我们究竟应该如何在 Android 上实现 Chrome 的本机应用程序安装提示？

我正在查看 Google 文档https://developers.google.com/web/fundamentals/app-install-banners/native，尝试找出如何在 Android 版 Chrome 上显示安装横幅来安装我们的本机应用程序。

首先，在几个地方，此页面指的是将您的应用程序添加到主屏幕，这不是此页面应该讨论的内容，对吧？这应该是关于安装本机应用程序，而不是 PWA。

但我真正的问题是：现实世界中的流程应该是什么样子？如果满足所有适当的条件，我们应该显示一个按钮或用户可以交互的其他东西，然后 Chrome 显示一个安装横幅？那么，我们显示一个按钮或横幅，上面写着“安装我们的应用程序”，然后如果用户单击它，Chrome 会显示另一个横幅，上面写着“安装”？这似乎是一种非常多余的体验，需要更多的按钮点击才能安装，而不仅仅是自动显示 Chrome 安装横幅（这是我收集的它过去工作的方式）。

我已经进行了大量搜索，但找不到任何人们展示他们如何使用当前流程的示例。真的有人用这个吗？

我应该使用类似的东西吗https://github.com/ain/smartbanner.js反而？

The docs令人困惑、具有误导性，并且经常引用 PWA。一旦您拥有清单并满足要求，将会出现一个带有install链接或add to home screen关联。以下是我对 Android 智能应用横幅的更新要求以及如何测试它。我在文档中添加了一项缺失的标准：需要多种不同的图标大小。

Android 本机应用程序安装提示要求

• Web 应用程序和本机应用程序均已安装。
• 满足用户参与启发式（当前，用户已与域交互至少 30 秒）
• Includes a Web App Manifest that includes:
  • 简称
  • 名称（在横幅提示中使用）
  • 图标包括36x36, 48x48, 72x72, 96x96, 144x144, 192x192, 512x512 version
  • Preferred_lated_applications 为 true
  • related_applications 对象，包含有关应用程序的信息
• start_url 可以设置为.对于当前位置
• Manifest is served over HTTPS - manifest.json
  • 将其包含在您的页面上<link rel="manifest" href="manifest.json" />

Testing

• 在 Android 设备或模拟器上登录 chrome
• 登录 Google Play 商店（设备上必须有 Play 商店）
• 在 Chrome 中启用此标志chrome://flags/#bypass-app-banner-engagement-checks
• 该应用程序不应已安装在设备上

调试

检查浏览器中的“源”选项卡，查看清单是否正确提供，并记住检查控制台是否有任何错误（警告可以）

Example

manifest.json

{
  "name": "App Name",
  "short_name": "App Name Install Banner Sample",
  "icons": [
    {
      "src": "icon-0-75x.png",
      "sizes": "36x36",
      "type": "image/png"
    },
    {
      "src": "icon-1x.png",
      "sizes": "48x48",
      "type": "image/png"
    },
    {
      "src": "icon-1-5x.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "icon-2x.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "icon-3x.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "icon-4x.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ],
  "prefer_related_applications": true,
  "related_applications": [
    {
      "platform": "play",
      "id": "com.google.samples.apps.iosched",
      "url": "https://play.google.com/store/apps/details?id=com.google.samples.apps.iosched"
    }
  ],
  "start_url": ".",
  "display": "standalone"
}