用于检查 PWA 或移动 Web 的 Javascript

Question

我很好奇是否有人知道一种基于 javascript 的方法来检测网络体验是作为 PWA(渐进式网络应用程序)运行还是只是作为标准移动网站(具有完整的浏览器 UI)运行。

“已安装”的 PWA 与未安装但仍注册了 Service Worker 和/或应用缓存的 PWA 之间有什么区别吗？

Answer 1

如果这是出于分析目的，您可以在 list 文件中设置起始 URL 以包含查询字符串参数，例如:

"start_url": "./?mode=standalone"

然后在您的 JavaScript 中，您可以检查此查询字符串参数。

---

更新 (2020-08-19)

Pete LePage 写了一篇关于如何使用下面的代码在 Google Analytics 中设置自定义维度的博客，该代码使用 window.matchMedia 检查显示模式:

let displayMode = 'browser';
  const mqStandAlone = '(display-mode: standalone)';
  if (navigator.standalone || window.matchMedia(mqStandAlone).matches) {
    displayMode = 'standalone';
  }
ga('set', 'dimension1', displayMode);

阅读更多:https://petelepage.com/blog/2020/08/measure-understand-how-installed-pwa-users-differ-from-browser-tab-users/

更新(2017-01-20):

或者，您可以使用以下方式 checkin JavaScript:

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