onPageStateChange在iphone上的2大坑点

onPageStateChange在iphone上的2大坑点,第1张

用法:

坑点:

1、在安卓和iphone下返回的值不一样。

2、在部分iphone机型下,只有点击小程序右上角的圆点返回才能触发!!!


用法:

onPageStateChange这个api,从微信7.0.3开始,webview内可以通过判断下面的方式判断小程序是否在前台:

WeixinJSBridge.on('onPageStateChange', function(res) {
  console.log('res is active', res.active)
})

有了这个api,我们可以解决很多问题,例如:

1、iphone手机上,小程序内嵌套的h5视频,切换到后台时,会自动暂停视频,切回前台依然是暂停状态,可以通过该api自动恢复播放。

2、监听切换到前台事件,做刷新数据等 *** 作。

坑点:

坑爹的东西来了。

1、在安卓和iphone下返回的值不一样。

在安卓上这个res.active返回的是string类型的值,

在iphone上,这个res.active返回的是boolean类型的值。

2、在部分iphone机型下,只有点击小程序右上角的圆点返回才能触发!!!

 这就是更恶心的bug了,目前我测试了iphonex下,手机home键可以触发,但是iphone11却只有点击右上角的圆点返回才能触发。

查阅资料后,果然有人发现同样问题。

 无奈,新api总会有缺陷,用就得有小白鼠的觉悟吧。

临时解决办法:

话是这么说,可是需求你还是得做吧,总不能两手一摊,说产品我实现不了这个功能。

于是,查了一下资料,原生js里有一个visibilitychange事件,可以监听当前页面窗口可见性是否发生了变化、

    addHtmlListener () {
      document.addEventListener('visibilitychange', _ => {
        console.log('visibilitychange', document.hidden)
        if (document.hidden) {
          // 网页被挂起 ---- 暂停音乐
        } else {
          // 网页被呼起 ---- 播放音乐
        }
      })
    },

经测试,对于上述问题2导致无法监听的场景,按home键,该api依然能够监听成功。

那么聪明的小伙伴可能会问了,那为什么不直接用这个api替换掉小程序的api呢?

那当然是这个api也有自身的局限性啊,例如我在1秒内按home切换,再快速返回,此时该api是无法监听到的!!

无奈......

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/996470.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存