Google Chrome 无法在桌面系统上检测到 PWA？

Posted 2023-02-23

【中文标题】Google Chrome 无法在桌面系统上检测到 PWA？

【英文标题】：Google Chrome cannot detect PWA on Desktop System?

【发布时间】：2019-12-19 05:29:32

【问题描述】：

正如google documents 所说，我已经完成了 PWA 的基本标准，并使用 通过 https 的安全连接，并注册了 service worker。我已经在 android 和 ios 设备上成功安装了 PWA。现在我想将我的 reactJS 网站安装为 PWA 桌面，但我无法成功。我错过了什么吗？

ma​​nifest.json

"short_name": "PWA DESKTOP",
"name": "PWA DESKTOP",
"theme_color": "#2196f3",
"background_color": "#2196f3",
"display": "standalone",
"start_url": "/",
"icons": [
 
  "src": "images/icons/icon-72x72.png",
  "sizes": "72x72",
  "type": "image/png"
,

  "src": "images/icons/icon-96x96.png",
  "sizes": "96x96",
  "type": "image/png"
,

  "src": "images/icons/icon-128x128.png",
  "sizes": "128x128",
  "type": "image/png"
,

  "src": "images/icons/icon-144x144.png",
  "sizes": "144x144",
  "type": "image/png"
,

  "src": "images/icons/icon-152x152.png",
  "sizes": "152x152",
  "type": "image/png"
,

  "src": "images/icons/icon-192x192.png",
  "sizes": "192x192",
  "type": "image/png"
,

  "src": "images/icons/icon-384x384.png",
  "sizes": "384x384",
  "type": "image/png"
,

  "src": "images/icons/icon-512x512.png",
  "sizes": "512x512",
  "type": "image/png"
 ]

【问题讨论】：

您使用的是哪个版本的 Chrome？根据 Chrome 官方文档，您至少需要 v73 才能在桌面上支持 PWA； developers.google.com/web/progressive-web-apps/desktop

我使用的是谷歌浏览器 版本 79.0.3945.88 。仍然 chrome 没有检测到它。

使用 HTTPS URL 运行时，您的 PWA 是否通过 Chrome Lighthouse 工具作为有效的 PWA 传递？

您是否在 Chrome 中检查过 ( chrome://apps/ ) 并删除了您之前的应用安装/测试？

@Mathias 我会检查的。

【参考方案1】：

最后，我发现了为什么我的 PWA DESKTOP 无法正常工作的问题。我创建了自定义服务工作者来集成推送通知，并且在注册服务工作者时，我覆盖了使用工作箱管理服务工作者的 create-react-app 服务工作者。

将自定义和 CRA 生成的服务工作者结合起来后，将完成这项工作。