检查 Progressive Web App 是否已安装

Question

我的网页上有一个弹出窗口，提示用户安装我们的 PWA。但是，一旦安装，我就不想再问他们了。

如何检查是否已安装 PWA？

Answer 1

下面的代码修复了这个问题。首先我有我的按钮，id="downloadli"默认情况下它是隐藏的或style="display:none"

由于您必须向 中添加一个侦听器以beforeinstallprompt触发安装，如果您取消该操作以显示下载按钮，则它仅在可以安装时才起作用。

window.addEventListener('beforeinstallprompt', (e) => {
// Prevent Chrome 67 and earlier from automatically showing the prompt
e.preventDefault();
// Stash the event so it can be triggered later.
deferredPrompt = e;

$('#downloadli').css('display', 'block');
});

这样，如果应用程序已安装，beforeinstallprompt则不会将其添加到页面并且不会运行此块的内部。