PWA浏览器应用卸载时是否触发DOM事件？需重置本地存储

目前没有标准的DOM事件会在PWA被卸载时触发，无法通过监听事件直接清除localStorage中的安装标记。针对你遇到的Android端卸载PWA后无法重新展示安装弹窗的问题，可以通过以下方案解决：

1. 使用navigator.getInstalledRelatedApps()主动检测安装状态 #

这个API可以直接查询当前设备是否已安装关联的PWA，能覆盖桌面和Android端场景，替代单纯依赖appinstalled事件设置的localStorage标记。

实现步骤： #

• 确保你的manifest.json中配置了正确的id字段（例如"id": "com.yourdomain.yourapp"）
• 在页面加载或关键时机调用该API更新安装状态：

async function syncInstallStatus() {
  if (!('getInstalledRelatedApps' in navigator)) return;
  
  const installedApps = await navigator.getInstalledRelatedApps();
  // 匹配manifest中配置的app id
  const isAppInstalled = installedApps.some(app => app.id === 'com.yourdomain.yourapp');
  
  localStorage.setItem('app-installed', isAppInstalled.toString());
}

// 页面加载时同步状态
window.addEventListener('load', syncInstallStatus);
// 页面重新聚焦时再次校验（比如用户卸载后切回网页）
window.addEventListener('visibilitychange', () => {
  if (document.visibilityState === 'visible') {
    syncInstallStatus();
  }
});

每次页面加载或重新激活时，都会主动检测实际安装状态，更新localStorage的标记，避免卸载后标记失效的问题。

2. 降级兼容方案 #

如果目标环境不支持getInstalledRelatedApps，可以：

• 给localStorage的安装标记设置过期时间，比如存储时同时记录时间戳，每次加载时判断是否过期，过期则重置标记
• 在页面提供手动触发入口（如「重新安装」按钮），点击时执行localStorage.setItem('app-installed', 'false')，强制重新触发安装弹窗

补充说明 #

Android端卸载PWA后localStorage未被清除的原因是：PWA的站点数据与浏览器的站点存储绑定，卸载PWA不会自动清除浏览器中该域名的本地存储，因此依赖安装时设置的静态标记会失效，必须通过主动检测的方式保证状态准确。

内容的提问来源于stack exchange，提问作者Sony