element upload上传视频，获取本地url地址和时长

获取视频的时长参考了文章 https://www.cnblogs.com/65Seeker/p/11466824.html

1.**URL.createObjectURL() **静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。

（个人感觉可以把对象转换成url使用，十分灵活方便，特别是对于文件对象）。
2.loadedmetadata 当指定的音频/视频的元数据已加载时，会发生 loadedmetadata 事件。音频/视频的元数据包括：时长、尺寸（仅视频）以及文本轨道。

以上是原博主的说明。

结合项目修改了部分，获取图片的url地址也是一样的操作，记录一下。

上传组件

 <el-form-item label="上传视频：" prop="videoIntroduce" style="margin-top:20px">
     <el-upload ref="upload" 
           class="avatar-uploader" 
           :action="actionURL" 
           :show-file-list="false" 
           :on-change="beforeAvatarUpload"
           :auto-upload="false"
           :http-request="handleRequest" 
           :headers="myHeaders"
           accept=".mp4" >

         <video v-if="vUrl !='' && videoFlag == false" :src="vUrl" class="avatar" 
            controls="controls">您的浏览器不支持 video
            标签。
         </video>
         <i v-else-if="vUrl =='' && videoFlag == false" class="el-icon-plus 
            avatar-uploader-icon">
         </i>
         <el-progress v-if="videoFlag == true" type="circle" :percentage="progressPercent"
            style="margin-top:30px;">
         </el-progress>

      </el-upload>

 </el-form-item>

js

beforeAvatarUpload(event) {
        // 获取上传视频的本地localUrl
        var localUrl = null;
        if (window.createObjectURL != undefined) {
          // basic
          localUrl = window.createObjectURL(event.raw);
        } else if (window.URL != undefined) {
          // mozilla(firefox)
          localUrl = window.URL.createObjectURL(event.raw);
        } else if (window.webkitURL != undefined) {
          // webkit or chrome
          localUrl = window.webkitURL.createObjectURL(event.raw);
        }
        // 转换后的地址为 blob:http://xxx/7bf54338-74bb-47b9-9a7f-7a7093c716b5
       console.log(localUrl)

        //获取视频时长
        var url = URL.createObjectURL(event.raw);
        var audioElement = new Audio(url);
        var duration;
        audioElement.addEventListener("loadedmetadata", function(_event) {
          duration = audioElement.duration; //时长为秒，小数，182.36
          // this.$parent.$data.wDuration = parseInt(duration);
          console.log(duration);
        });
        if (event.raw.type === "video/mp4") {
          this.handleRequest() //验证通过，手动上传文件
          this.vUrl = localUrl
        } else {
          this.$message.error("只能上传mp4格式");
        }
      },