如何检测PWA是否已在IOS上安装

Question

我有一个PWA Angular应用程序，我想向用户显示弹出窗口，让他/她可以将应用程序添加到主屏幕。

我不希望在PWA中显示此通知，只想在IOS Safari中显示，因此我使用以下检查：

const isInStandaloneMode = () => ('standalone' in window.navigator) && (window.navigator.standalone);

如果用户已经安装了PWA，我也不希望在IOS Safari上显示此弹出窗口，有没有办法检查PWA是否已经安装？

- O. Shekriladze

Answer 1

是的，如果用户从 iOS 主屏幕启动你的 PWA，该代码将返回 true。

您也可以简化您的代码：

const iOSCanInstall = 'standalone' in window.navigator;
const iOSIsInstalled = window.navigator.standalone === true;

这样，您就知道他们是否是可以潜在安装您的PWA的iOS用户，以及他们是否已经从主屏幕打开了您的PWA。

如果用户在浏览器中打开您的PWA，很遗憾没有办法检查它是否已经被安装。在Chrome/Edge中，您可以使用getInstalledRelatedApps()，但可惜这并不能解决您的问题。

- PeteLe

---

你可以通过使用 window.matchMedia('(display-mode: standalone)').matches 来改进它。 - PedroZorus

@PeteLe const iOSIsInstalled = window.navigator.standalone === true; 这行代码将检测打开的应用程序是PWA还是来自浏览器。但我们需要知道abc.com的PWA是否已安装。 - cakePHP