vue / js使用video获取视频时长

项目中遇到上传视频功能,需要有预览和获取视频时长功能,因之前使用upload(有需要的话可以参考下我之前的文章),这里就不赘述,直接用来上传视频,不过在上传之前和上传成功后的钩子里,获取不到时长:

没有时长怎么办呢,只能用原生JS来获取:

上传成功以后,将成功的路径绑定给video

使用js获取duration并赋给时间参数

这时你会发现,你得到的值是NaN

视频还未加载下来,无法同步获取到,使用定时器即可解决

OK了,现在可以获取到了

希望本文对你有所帮助!

原文地址:https://www.cnblogs.com/wangqiao170/p/9359760.html

时间: 2024-10-29 00:51:12

vue / js使用video获取视频时长的相关文章

获取视频时长

//            NSDictionary *opts = [NSDictionary dictionaryWithObject:[NSNumber numberWithBool:NO] //                                                             forKey:AVURLAssetPreferPreciseDurationAndTimingKey]; //            AVURLAsset *urlAsset

使用ffmpeg获取视频时长等

查看视频信息的命令:ffmpeg -i 视频文件,如下: ffmpeg -i ryzh.mp4 控制台输出: 原文地址:http://blog.51cto.com/4754569/2324534

获取音、视频时长(NAudio,Shell32,FFmpeg)

参考网址:https://blog.csdn.net/u013810234/article/details/57471780 以下为本次测试用到的音.视频格式: audio :".wav;.mp3;.wma;.ra;.mid;.ogg;.ape;.au;.aac;"; vedio :".mp4;.mpg;.mpeg;.avi;.rm;.rmvb;.wmv;.3gp;.flv;.mkv;.swf;.asf;"; Note: 1. 测试音.视频均为对应格式的有效文件(下

layui上传视频并获得视频时长的方法

layui官方上传视频时并没直接提供获取视频时长的方法,需要我们间接获得 HTML增加一个<video>标签,因为video标签可以帮我们获取视频时长 <video id="videoattr" width="250" height="100" ></video> 当然,你也可以设置隐藏. 然后JS就可以利用<video>的duration来得到时长. //同时绑定多个元素,并将属性设定在元素上 u

统计指定目录下的视频时长

有时间可以写成递归的 1 package org.zln.video.demo1; 2 3 import it.sauronsoftware.jave.Encoder; 4 import it.sauronsoftware.jave.EncoderException; 5 import it.sauronsoftware.jave.InputFormatException; 6 import it.sauronsoftware.jave.MultimediaInfo; 7 8 import ja

javascript 获得以秒计的视频时长

<!DOCTYPE html> <html> <body> <h3>演示如何访问 VIDEO 元素</h3> <video id="myVideo" width="320" height="240" controls> <source src="/i/movie.mp4" type="video/mp4"> <sour

VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property &#39;xxxx&#39; of undefined 的解决办法

正常情况下在data里面都有做了定义 在函数里面进行赋值 这时候你运行时会发现,数据可以请求到,但是会报错 TypeError: Cannot set property 'listgroup' of undefined 主要原因是: 在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定.可以看下 Stackoverflow 的解释: 解决办法: 1.用ES6箭头函数,箭头方法可以和父方法共享变量 2.在请求axios外面定义一下 var that=this 问题

获取音频时长的总结

需要实现的需求: 前端展示录音的时长 实现该需求的前提条件: 1.深海捷(录音厂商)提供了两个关于录音的接口,一个是下载接口(访问接口,直接就下载音频文件了), 另一个接口是播放接口(接口返回一个html文件,文件中用Object标签实现了播放,可是只能在ie下播放,在chrom中无法展示播放器) 2.如果使用深海捷的服务拨打电话后,是会有回调事件,返回录音时长存到数据库的,所以这种场景已经有录音时长的数据,前端直接展示就 可以 3.还有一种场景就是接下来需要实现的场景,用户手动上传录音,这个时

JS的video获取时长,出现问题汇总

<video id="my_video_1" controls="controls" style=" width: 700px; height: 420px; margin: 0 auto; padding-top: 0px;"> <source src="@ViewBag.Url " type="application/x-mpegURL"> </video> 1,vi