1、bindplay回调在安卓手机的机型下无限触发
2、bindtimeupdate进度变化回调事件
该事件微信官方给的调用频率是250ms,但是在实际的开发中的触发频率并不是250ms
3、bindpause、bindended的触发时机
官网给的逻辑是:视频播放到结束,会调用暂停事件,再调用结束事件,但是在安卓手机播放结束并没有触发暂停事件
bindpause绑定的方法下不要写视频暂停
4、代码观看进度统计
进度变化时开启定时器,每5秒传递一下进度,视频暂停或者播放完成时
timeupdate(e) {
this.setData({
durationTime: e.detail.currentTime, //进度
})
if (!this.tiemer) {
this.tiemer = setInterval(() => {
this.setData({
allTime: this.data.allTime+ 1
})
if (this.data.allTime% 5 == 0) {
this.data.allTime? this.update(5):''
}
}, 1000)
}
},
ended() {
console.log('结束播放')
if (this.data.allTime) {
this.data.isRouter != 1 ? this.update() : ''
setTimeout(() => {
if (this.tiemer) {
this.setData({
durationTime: '',
allTime: 0,
})
clearInterval(this.tiemer)
this.tiemer = ''
}
this.data.isRouter != 1 ? this.getList() : ''
}, 500)
}
},
update(secod) {
if (!this.data.allTime) return
let params = {
id: this.data.list.id,
percent: secod == 5 ? 5 : Math.round(this.data.allTime% 5),
videoDuration: secod == 5 ? 5 : Math.round(this.data.allTime% 5),
}
app.api._post('/video/update', params).then(res => {
console.log('update', res)
console.log('更新完成')
}).catch()
},
<video objectFit="cover"
id="videos" src="{{list.url ||''}}" poster="{{list.posterUrl}}"
controls="{{controls}}" enable-danmu enable-progress-gesture="{{false}}" class="videos"
show-center-play-btn="{{false}}" bindtimeupdate="timeupdate" bindended="ended" bindpause="pause"></video>