PWA 未在 Android 上显示“添加到桌面”弹出窗口（在 Chrome 和 Brave 浏览器中显示）答案

【问题标题】：PWA not showing "add to desktop" popup on Android (does show in Chrome and Brave browsers)PWA 未在 Android 上显示“添加到桌面”弹出窗口（在 Chrome 和 Brave 浏览器中显示）
【发布时间】：2020-09-22 12:11:40
【问题描述】：

我已完成所有必需的步骤，确保清单中的所有内容都在那里：

开始网址
姓名
短名称
说明

范围设置为 / 并且所有图标都在那里。

{
  "description": "C5 manifest",
  "name": "C5",
  "short_name": "c5",
  "icons": [
    {
      "src": "/icons/icon_512x512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_384x384.png",
      "sizes": "384x384",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_192x192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_152x152.png",
      "sizes": "152x152",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_144x144.png",
      "sizes": "144x144",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_120x120.png",
      "sizes": "120x120",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_64x64.png",
      "sizes": "64x64",
      "type": "image/png",
      "purpose": "any maskable"
    },
    {
      "src": "/icons/icon_32x32.png",
      "sizes": "32x32",
      "type": "image/png",
      "purpose": "any maskable"
    }
  ],
  "start_url": "https://c5.kwyjibo.app/",
  "display": "standalone",
  "background_color": "#FF13DB",
  "theme_color": "#FF7D13",
  "lang": "en"
}

我也使用过 Lighthouse，它通过了他们的所有检查。但是，在 Android 上的 Chrome 或 Firefox 中打开“添加到主页”弹出窗口时不会显示。

我为 load 和 beforeinstallprompt 事件添加了事件侦听器，看起来它们确实被调用了。

谁能解释一下？我无计可施。该网站是https://c5.kwyjibo.app/

【问题讨论】：

标签： progressive-web-apps service-worker

【解决方案1】：

对于其他找到此内容的人。问题是 service worker 不支持离线。将其更改为支持脱机并确保我在根目录中有一个 offline.html 文件解决了问题。

【讨论】：