如何记录PWA是作为网站还是应用程序进行查看

Question

我正在开发一个PWA(渐进式网络应用程序),我希望能够跟踪某人是否只是将其视为一个网站,或者是否已安装它并将其视为应用程序.

有没有办法做到这一点？我想不出任何方法,因为它们都使用相同的文件(使用manifest.json和manifest.json都指向同一个index.html).

Windows 10提供了从其应用商店安装PWA的功能.此时,您可以收集一些分析.不幸的是,这将是一个有限的安装基础(与从浏览器安装它相比).

Answer 1

选项1 :

Manifest.json的启动URL仅​​在您添加到主屏幕后访问它时使用.您可以将您的起始网址设为" https://example.com/myapp?isPWA = true "

在主页中,有逻辑来读取查询参数和标志,并根据该逻辑执行逻辑.在浏览器模式下,此标志将不存在,因此在这种情况下逻辑应视为false.这是适用于所有平台的通用解决方案.

选项2:

作为替代方案,您可以在JS中使用显示模式检测.

非Safari(Safari兼容性可能会在新版本中出现)

CSS解决方案

@media all and (display-mode: standalone) {
  body {
    background-color: yellow;
  }
}

JS解决方案

if (window.matchMedia('(display-mode: standalone)').matches) {
  console.log('display-mode is standalone');
}

Safari JS解决方案

if (window.navigator.standalone === true) {
  console.log('display-mode is standalone');
}