阅读 51

vue-video-player插件在微信浏览器X5内核中的坑

前段时间开发了一个基于vue的H5短视频页面,要放在公众号栏目中,必须在微信内置浏览器中访问,滑动组件用的vue-awesome-swiper,视频播放用的vue-video-player,上线后个别用户反馈视频播放有问题,点击视频之后自动全屏无法滑动了,我马上找他们复现效果,还真是这样,video标签只要一被点击就会自动全屏,经过反复测试最后断定是Android系统下部分手机才会有这个问题,IOS不会出现问题,经过2天通过的各种找资料,各种改参数,刷完了vue-video-player的issue,全部尝试完了之后还是不行,还是无法阻止开启了x5内核的微信内置浏览器自动劫持video标签,无奈只能用js识别用户的微信浏览器内核,如果不是系统内核就提示用户访问这个页面的时候关闭x5内核。

代码参考链接:

//使用微信访问,获取代理
        var ua = navigator.userAgent;
        var version = "000000";
        var key = "TBS/";
        var start = ua.indexOf(key);
        if (start !== -1) {
            start = start + key.length;
            version = ua.substr(start, ua.indexOf(" ", start) - start);
        }
        if(version.indexOf("000000") !== -1){
            window.location.href = ‘/h5/pages/index/index‘;
            return;
        }

 

微信内置浏览器中访问以下链接:

开启x5内核链接:debugmm.qq.com/?forcex5=true

关闭x5内核链接:debugmm.qq.com/?forcex5=false

开启了x5内核就可以访问debugx5.qq.com,并且会出现菜单项,

如果关闭了x5内核,再访问debugx5.qq.com的时候应该会提示你未开启x5内核,需要手动开启,但是还有一种情况是你点击了关闭x5内核的链接,页面也提示 x5内核状态为false,你访问debugx5.qq.com还是能出现菜单项,那就说明关闭x5内核失败了,这个问题我也很纠结,不知道是什么原因导致的。。。只能备份聊天记录重装微信了。。。

 

 

这篇文章就是记录一下短视频业务在微信浏览器下的坑,分享出来帮助其他的开发者兄弟们少走点弯路,早点下班回窝。

 

原文:https://www.cnblogs.com/sauronblog/p/12849663.html

文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐