Question

我正在编码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 Dev Tools时，如果转到“应用程序”>“清除存储”下的“应用程序”标签，并且仅选中未注册服务人员选项并清除缓存，然后再次访问页面上，一切都会按预期进行。

起初，我假设它可能与高速缓存有关，因为我正在使用状态管理，但是如果事件存储在高速缓存中，我没有任何想法，如果是，我不知道如何获取{{1} }来自该缓存的事件。

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

用户第二次进入页面之前未捕获到beforeinstallprompt事件

0 个答案: