收藏
回答

video组件bindtimeupdate来统计怎么理统计用户观看视频时长?

框架类型 问题类型 提审时间 AppID
小程序 需求 2018-11-15 wxdb2f4ea305d15fc7


video组件bindtimeupdate如果快进的话时间会不准确。用video组件怎么来监听用户观看视频的时长?


回答关注问题邀请回答
收藏

2 个回答

  • Lemtasev
    Lemtasev
    2019-07-05

    关于小程序统计视频观看时间可以参考一下解决方案,推荐自定义Interval

    bindtimeupdate是不能精确统计的喵!

    <style lang="less">

    video{
    width: 100%;
    }

    .yi-ma-hong{
    color: red;
    }

    </style>
    <template>
    <view class="container">

       <video src="https://media.w3.org/2010/05/sintel/trailer.mp4" controls show-mute-btn  enable-play-gesture title="test-video"
              bindtimeupdate="videoTimeUpdateFunction" bindplay="videoBindPlay" bindpause="videoBindPause"></video>

       <view>bindtimeupdate统计已观看时长,totalTime={{totalTime}}</view>
    <view>setInterval统计已观看时长,totalTime2={{totalTime2}}</view>
    <view class="yi-ma-hong">注:</view>
    <view class="yi-ma-hong">决计不要用bindtimeupdate来统计已观看时长,你可以试一下不断暂停、播放,神特喵的totalTime误差到外婆家了,totalTime2误差可以忽略。</view>

    </view>
    </template>

    <script>
    import wepy from 'wepy'

     export default class tVideo extends wepy.page {
    config = {
    navigationBarTitleText: '小程序视频测试'
       }
    data = {
    totalTime: 0, // 观看总时间,ms
         totalTime2: 0, // 观看总时间,ms
         interval: {},
    intervalDur: 100
       }

    methods = {
    videoTimeUpdateFunction(e) {
    // 播放进度变化时触发,e.detail = {currentTime, duration} 。触发频率 250ms 一次
           console.log(e.detail)
    this.totalTime += 250
         },
    videoBindPlay() {
    this.interval = setInterval(() => {
    this.totalTime2 += this.intervalDur
           }, this.intervalDur)
    },
    videoBindPause() {
    clearInterval(this.interval)
    }
    }

    onUnload() {
    clearInterval(this.interval)
    }
    }
    </script>
    2019-07-05
    有用
    回复
  • 喵慢慢先生~网站小程序app开发
    喵慢慢先生~网站小程序app开发
    2018-12-01

    你解决了吗 这个时间不准啊

    2018-12-01
    有用
    回复 1
    • cola
      cola
      2018-12-03

      还没有,这块视频统计时长有什么方法吗?

      2018-12-03
      回复
登录 后发表内容