beforeinstallprompt在显示本机安装弹出窗口之前，我使用事件向用户显示自定义 PWA 安装弹出窗口。对于我们的一些用户，他们已经将 PWA 安装到了他们的桌面，他们再次获得了自定义弹出窗口。发生这种情况的唯一方法是beforeinstallprompt事件再次触发。那可能吗？

beforeinstallprompt即使将 PWA 安装到用户系统，浏览器也会触发事件吗？

报告了 Google Chrome 的问题。

我无法加载安装提示并要求用户添加到主屏幕我不明白将代码添加到哪个文件的位置。我正在运行一个 wordpress 网站。我有一个清单以及服务人员，但我无法将添加到主屏幕以在移动设备和/或桌面上弹出。请帮我

清单代码如下

}

这是 service-worker.js 代码

});

Beforeinstallprompt 在每次加载时触发。我在这里使用了代码：https ://developers.google.com/web/fundamentals/app-install-banners/ 我没有使用我通过调用禁用的迷你信息栏e.preventDefault();

问题是，showAddToHomeScreen();如果用户不点击，每次加载都会调用addToHomeScreen。

我希望该showAddToHomeScreen();函数仅每月左右调用一次，方法是存储有关会话中最后一次“取消”点击或类似内容的信息。谷歌不应该自己做这个吗？

这是我在以下链接中找到的： https ://developers.google.com/web/updates/2018/06/a2hs-updates

您只能在延迟事件上调用 prompt() 一次，如果用户单击对话框上的取消，则需要等到在下一页导航中触发 beforeinstallprompt 事件。与传统的权限请求不同，单击取消不会阻止将来对 prompt() 的调用，因为它必须在用户手势内调用。

当地址输入 Android 设备上的 Chrome 浏览器时，我有一个 PWA 可以正常工作（目前在 Android 9 上使用 Chrome 76）。加载站点后，我会收到 beforeinstallprompt 事件并显示我的安装消息。但是，如果该站点是从 SMS 消息中的超链接打开的，那么在点击页面之前我不会收到该事件。这是期待吗？有没有人处理过这个问题？

我正在编写 PWA 并使用state management。我面临的问题是用户第一次访问该页面时，我能够存储beforeinstallprompt事件并显示我的自定义安装按钮。

问题是，如果用户忽略安装并重新加载页面，则不再捕获该事件。下面的代码：

基本上，第一次一切正常时，后续访问只会显示pipe console日志消息，而不会进入addEventListerner代码的其余部分。

O 注意到，在使用 Chrome 开发工具时，如果我转到应用程序 > 清除存储下的应用程序选项卡，并且只检查未注册的服务工作人员选项并清理缓存，然后再次访问该页面，一切都会按预期工作。

起初，我认为它可能与缓存有关，因为我正在使用状态管理，但我不知道是否将事件存储在缓存中，如果是，我不知道如何beforeinstallprompt从该缓存中获取事件。

由于清理服务人员选项似乎“重新建立”了预期的行为，我正在寻找一个解决方案，我能够验证事件是否先前被触发，以便我可以触发上述代码的逻辑（或者可能改进它以考虑该验证）。

即使在符合所有 PWA 规范并在 Light House 上进行检查后，添加到主屏幕也不会提示。

我试过下面的代码来检查应用程序是否已经安装。但是 appinstalled 事件没有被触发并且 beforeinstallprompt 事件被成功触发。

// 已安装应用

window.addEventListener('appinstalled', (evt) => { app.logEvent('a2hs', 'installed'); });

// 安装前提示

与其他正常的 PWA 安装问题相比，我的情况有点奇怪。我使用 LightHouse 审核了我的代码，尽管我看不到该选项，但它给了一切绿色

“可以提示用户安装 Web 应用程序”。

我在 React 中为我的 PWA 应用程序的自定义提示编写了一些代码。它是这样的

在 app.js 文件中的 componentDidMount 方法中

使用状态isModalOpen我可以在普通桌面浏览器中向用户显示自定义提示。但是当我在移动浏览器上运行相同的东西时，这个 beforeinstallprompt 不会被触发。我试过了

iOS 中的 Safari 浏览器 iOS 中的 Chrome 浏览器

Android 中的 Chrome 浏览器

任何人都可以指导我了解我可能会缺少什么。或者如果有人遇到过这样的问题

我有最糟糕的一周试图弄清楚如何重置我的 Chrome 浏览器设置，因为我有一个功能齐全的网站，其中包含一个工作清单、服务工作者和 A2HS 脚本。它完美地工作，除了我个人拥有的任何带有谷歌浏览器的设备......

意思是，我有一台台式机和一部 Android 手机，两者都装有最新版本的 Google Chrome（截至 2020 年 4 月 9 日 v81.0.4044.92（官方版本）（64 位）），但我无法获取 addEventListener - > beforeinstallprompt 开火。我已经仔细检查了“应用程序”按钮，在这两种情况下我都仔细检查了我的桌面，并且我已经清除了开发人员工具 -> 应用程序下的存储空间。但是无论如何，没有什么能让我在这两个设备上调用 addEventListener -> beforeinstallprompt 。

这是真正的踢球者，它在我尝试过的其他所有人的计算机上都能完美运行！它只是拒绝在我的开发系统上工作。它必须与我自己设备上的安全设置有关，但我需要弄清楚这一点，因为它也可能发生在该网站的访问者或我客户的系统上，而且我完全没有想法，我已经已经为此工作了3天。一定有一个神奇的按钮可以在 Chrome 设置中的某个地方解决这个问题。

有什么想法吗？

非常感激。

文斯

更新

好的，我已经在一个之前甚至没有安装 Chrome 并且它也不想在那里工作的系统上对此进行了测试，所以缓存不再是问题，它一定是我的代码有问题。这就是我得到的。

显现：

服务工作者：

安装按钮：

CSS：

添加到主屏幕 (A2HS) 代码：

在 A2HS 代码中，它从不执行这一行：

我认为当我在我妻子的计算机上检查它时它起作用的原因是因为它仍在运行几周前的旧缓存版本。有任何想法吗？

1. 网站网址：[已编辑]
2. 提示适用于三星互联网、Windows 桌面 Chrome、Android Chrome
3. 提示在 Safari 或 iOS 版 Chrome 中不起作用
4. Lighthouse 测试通过（忽略 start_url 错误，无论我是否修复它都没有效果。我试过了）
5. PWA 可安装在 Android、iOS 和 Windows 上
6. 离线模式在 PWA 中按预期工作
7. 当我运行灯塔测试时，我收到控制台错误（即使图像确实存在）：尝试使用清单中的以下图标时出错：[redacted]/assets/icons/icon-144x144.png（下载错误或资源是'不是一个有效的图像）
8. 清单有效且无语法错误
9. 实际应用是在 /app 上运行的 Angular 9 应用
10. 当 beforeinstallprompt 触发时，“在浏览器中继续”按钮应该消失并替换为“安装应用程序”按钮

PWA 在 iOS 上工作，为什么提示不起作用？

我在 React Web 应用程序中集成了 PWA 功能，并且当在移动设备中打开时，在生产应用程序中触发了 beforeinstallprompt 事件。我想在桌面开发环境中触发这个事件。有没有办法做到这一点。我参考了有关此问题的stackoverflow 答案并更新了 chrome 浏览器设置，但未触发该事件。