微信 H5 记录视频播放进度

需求：

微信端看视频，关闭微信的窗口时需要记录当前播放时间，下次在进入的时候从上次保存的进度开始播放

面临的问题：

1. 监控微信离开页面
2. 重新进入时候从上传保存的地方播放

设备环境：iPhone 6s 微信

处理：

1. 监控离开
   开始的时候使用onbeforeunload事件，发现微信端离开时并未调用记录进度的脚本
   改用 pagehide事件，貌似也没调用记录进度的脚本
   因此改用一个折中的方式
   使用video.ontimeupdate事件做监控，实时记录进度
2. 重新进入的时候需要从上次播放的地方开始播放
   开始在视频初始化时设置currentTime进度，并不生效
   经过多方折腾，在video.onloadeddata事件中设置，解决了问题

代码清单：

实时记录进度

audio.ontimeupdate = function () {
            
            if(window.localStorage) {
                var courseId = $('#courseId').val();
                if(!playBackCache) {
                    playBackCache = {};
                }
                playBackCache[courseId] = audio.currentTime;
                localStorage.setItem('playBackCache' , JSON.stringify(playBackCache));
            }
        };

在上次记录的进度开始播放

//_currentTime  是从上面的缓存中获取的时间进度
audio.onloadeddata = function() {
        if(_currentTime > 0) {
            audio.currentTime = _currentTime;
        }
    }

其实我觉得我的方法并不完善，发布出来也想知道大家对于这样的需求是怎么处理的，可以讨论一下

PS:

经过测试，在onloadeddata并不会设置audio.currentTime，再次进行改造

//_currentTime  是从上面的缓存中获取的时间进度
audio.ontimeupdate= function() {
        if(_currentTime > 0) {
            audio.currentTime = _currentTime;
        }
    }