element upload上传视频,获取本地url地址和时长 |
您所在的位置:网站首页 › 获取youtube的视频地址 › 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地址也是一样的操作,记录一下。 上传组件 您的浏览器不支持 video 标签。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格式"); } },
|
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |