我在我的 Angular 项目中开发了 PWA,PWA 安装横幅通过调用如下prompt()
事件显示在 chrome 浏览器上,
this.promptEvent = event;
this.promptEvent.prompt();
但有时它会抛出错误
必须使用用户手势调用 prompt() 方法。
我找不到解决方案,任何帮助将不胜感激。
我在我的 Angular 项目中开发了 PWA,PWA 安装横幅通过调用如下prompt()
事件显示在 chrome 浏览器上,
this.promptEvent = event;
this.promptEvent.prompt();
但有时它会抛出错误
必须使用用户手势调用 prompt() 方法。
我找不到解决方案,任何帮助将不胜感激。
使用按钮点击等用户操作触发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