Question

我已经在我的有角项目中开发了PWA，通过调用如下的hint（）事件，Chrome浏览器中会显示PWA安装横幅

this.promptEvent =事件； this.promptEvent.prompt（）;

，但有时会抛出错误“ 必须使用用户手势调用hint（）方法”。

我找不到解决方案，我们将不胜感激。

Answer 1

使用诸如按钮clic之类的用户动作触发prompt()，请不要在推迟事件后立即执行。


    var promptEvent; 

    // Capture event and defer
    window.addEventListener('beforeinstallprompt', function (e) {
        e.preventDefault();
        promptEvent = e;
        listenToUserAction();
    });

    // listen to install button clic
    function listenToUserAction() {
        const installBtn = document.querySelector(".install-btn");
        installBtn.addEventListener("click", presentAddToHome);
    }

    // present install prompt to user
    function presentAddToHome() {
        promptEvent.prompt();  // Wait for the user to respond to the prompt
        promptEvent.userChoice
          .then(choice => {
              if (choice.outcome === 'accepted') {
                  console.log('User accepted');
              } else {
                  console.log('User dismissed');
              }
          })
    }

链接到完整的教程https://love2dev.com/blog/beforeinstallprompt

请注意，这仅在某些浏览器https://developer.mozilla.org/en-US/docs/Web/API/BeforeInstallPromptEvent#Browser_compatibility

中有效

在角度PWA中，必须使用用户手势错误来调用hint（）方法

1 个答案: