我正在编写 PWA 并使用state management。我面临的问题是用户第一次访问该页面时,我能够存储beforeinstallprompt
事件并显示我的自定义安装按钮。
问题是,如果用户忽略安装并重新加载页面,则不再捕获该事件。下面的代码:
private deferAppInstall() {
const subscription = this.actions$
.pipe(ofActionDispatched(PwaStateActions.DeferAppInstall))
.subscribe(_ => {
console.log('pipe console ');
window.addEventListener('beforeinstallprompt', event => {
console.log('addEventListener console');
this.pwaStateService.setInstall(true);
this.deferredInstallPrompt = event;
event.preventDefault();
subscription.unsubscribe();
console.log('unsubscribe console');
});
});
}
基本上,第一次一切正常时,后续访问只会显示pipe console
日志消息,而不会进入addEventListerner
代码的其余部分。
O 注意到,在使用 Chrome 开发工具时,如果我转到应用程序 > 清除存储下的应用程序选项卡,并且只检查未注册的服务工作人员选项并清理缓存,然后再次访问该页面,一切都会按预期工作。
起初,我认为它可能与缓存有关,因为我正在使用状态管理,但我不知道是否将事件存储在缓存中,如果是,我不知道如何beforeinstallprompt
从该缓存中获取事件。
由于清理服务人员选项似乎“重新建立”了预期的行为,我正在寻找一个解决方案,我能够验证事件是否先前被触发,以便我可以触发上述代码的逻辑(或者可能改进它以考虑该验证)。