问未为在SPA上创建的PWA调用“‘beforeinstallprompt”事件
EN

Stack Overflow用户

提问于 2020-04-17 20:17:55

回答 1查看 77关注 0票数 1

我有一个SPA，叫做https://www.example.com。并且子页面https://www.example.com/foo中的一个可以被添加为PWA。在从主页导航到/foo时，可以正确安装和注册清单和服务工作者，也可以从A2HS本机按钮安装PWA，但在chrome上不会调用事件beforeinstallprompt。如果刷新了页面/foo，则调用该事件。只有当导航发生在另一个不在PWA范围内的页面时。灯塔审计也通过了/foo上的所有测试。是否有人尝试在SPA上创建多个PWA，或遇到类似问题？

service-worker

progressive-web-apps

manifest.json

google-chrome

回答 1

Stack Overflow用户

发布于 2021-03-16 21:28:25

我不认为这是一个好的解决方案，但这是我在我的Gatsby.js站点上绕过它的方法：

在每个页面上(即使在那些我没有“添加到主页”自定义触发器的页面上)，我侦听beforeinstallprompt事件。
我在具有“添加到主页”自定义触发器的页面上的<html>元素上为自定义事件设置了一个侦听器。
当beforeinstallprompt触发时，我使用jQuery的$.data()在<html>标签上隐藏了对事件的引用(这不会在页面之间交换出来)-我无法让普通的JavaScript dataset工作，但我可能一直在错误地使用它，而且我还是加载了jQuery。
在beforeinstallprompt处理程序中，在设置数据之后，我在<html>元素上触发了自定义事件。
具有“添加到主页”自定义触发器的页面捕获了这个自定义事件。从$( 'html ').data( 'event' )获取对beforeinstallprompt事件的引用，并照常继续。

希望这能有所帮助；这感觉很麻烦，但我对PWAs / SPAs / React还很陌生！

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/61271481

复制

相似问题

问未为在SPA上创建的PWA调用“‘beforeinstallprompt”事件
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问未为在SPA上创建的PWA调用“‘beforeinstallprompt”事件EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问未为在SPA上创建的PWA调用“‘beforeinstallprompt”事件
EN