关于微信浏览器video不自动播放并且获取第一帧和总时长的问题

关于微信浏览器video标签获取第一帧和总时长的问题

最近项目中需要上传视频并限制播放时长。还要展示第一帧画面

技术实现。通过Input file 获取上传的视频资源，读取之后转成blob，放到video标签上。然后获取第一帧和视频时长。

问题来了

在pc开发的时候。video标签可以自动获取到第一帧。然后video onloadeddata的方法。可以获取时间。
但是在微信端因为视频是不能自动播放的。也就是不能出发onloadeddata方法。获取不到第一帧。并且微信浏览器video标签，获取不到第一帧图像。

解决方案
项目是vue。这里只介绍方法。不介绍样式。样式大家自己根据ui稿。

   <video
        ref="video"
        src
        alt
        class="img_video"
        muted="true" //静音  某些文章说设置muted然后设置autoplay可以自动播放，然后并没有什么用。出于玄学。没有删除
        id="video"
        x5-playsinline="true" //微信自动播放会全屏播放，设置此属性 可以小窗口播放
        playsinline="true"
        webkit-playsinline
        autoplay
        controls
        preload="preload"
      ></video>
       <input
            class="file_video"
            type="file"
            accept="video/*"
            ref="file_video"
            id="file_video"
            @change="addVideo"
          />
methods:{
   
	getObjectURL....
	addVideo...
}
 getObjectURL(file) {
    //转换成blob对象 不要问。
      var url = null;
      if (window.createObjectURL != undefined) {