前言:上一篇文章分享了pwa如何添加到主屏幕,本文分享下如何进行通过pwa桌面图标打开网页、以及通过点击事件是否安装的事件统计。
上一篇文章由此访问 渐进式 Web 应用(PWA) 添加到主屏幕_qq_38469220的博客-CSDN博客
1、pwa 安装除了被动触发,也可以通过点击事件,由用户主动触发,对于用户更加友好;
- 使用preventDefault先禁掉再通过prompt方法主动触发。
- event事件的prompt方法只能放到监听用户动作里。
- beforeinstallprompt事件,在用户拒绝安装后必须设置为空。等待下次触发。
2、 具体实现方式
首先在html文件添加一个点击按钮:
<button hidden id="installBtn">安装应用</button>
然后新建一个js文件进行逻辑处理
window.addEventListener('load', function () {
let appPromptEvent = null;
// 判断是通过网页启动还是通过主屏幕图标启动
if(this.window.location.href.match('pwa=client')){
console.log('通过图标打开')
}else{
console.log('网页端打开')
}
c