今天工作中遇到的问题，需要视频时长计算观看进度。观看进度=实际视频播放时间点/视频时长。实际视频播放时间点只会小于等于视频时长，也就是视频的某个时间点上，并不是页面停留时间。所以获取视频时长必须准确

由于公司使用了阿里云的视频点播服务，需要把视频上传阿里云之后再获取视频时长并保存到我们的MySQL数据库。

可能会有同学讲直接前端js获取嘛，一开始我也是这么做的，代码差不多像这样:

<video style="display:none;" controls="controls" id="aa" oncanplaythrough="myFunction(this)"> </video>
<input type="file" onchange="changeFile(this)" />

function myFunction(ele) {
	console.log(ele.duration);
} 
function changeFile(ele){ 
 var video = ele.files[0]; 
	var url = URL.createObjectURL(video); 
	document.getElementById("aa").src = url; 
} 

这样很好啊对吧，一开始没有问题，因为我测试的视频MP4格式，但是flv,mktv,wmv...掉坑里了，其他格式不保证获取到时长，好忧伤只能想别的办法，不可能让用户只能上传MP4吧，得被骂死。

于是乎，上传视频能得到有一个VID标识该视频（准确是开始上传就已经获得VID，因为上传之前得传递视频名称获取上传凭证，获得上传凭证时候就已经获得VID），阿里云点播服务API传递该视频VID会得到视频详细信息，包括播放地址URL，时长，码率...总之很多，各种视频格式都能拿到，nice！继续看文档发现上传转码完成有给了一个回调，意思是上传完成通知你（根据视频大小不同转码时间不同，没有转码完成是获取不到任何视频信息的，转码完成通知时候一定可以获取时长）又激动了一把。

那就转码完成时候调用API获取视频详细信息，很不错吧，这有一个问题，批量上传10个，20个...①那么得等到转码完成才一起连同时间保存数据到数据库？②还是先保存除时间外的信息然后返回该条数据id（此时没有时间，转码完成再更新填入时间）？

第一种用户等得了吗，大的视频转码得一分钟到几时分钟不等，直接pass！

第二种貌似很好，我先保存时间之外的该条视频数据到数据库（VID也要保存，之后查询时间信息和别的）就告诉用户说保存成功了，之后转码完成事件返回VID再根据VID调用阿里云API查询时间，然后根据VID更新该条视频在MySQL数据库时间。完美？仔细想一想，万一公司接受阿里云转码完成事件回调的接口服务挂了，那么永远也不知道该视频时间，因为没有被回调来保存时间。这也是一个问题！

别的办法？恩，有了。

最终我们解决方案是：用户上传完成视频就保存除了时间之外的信息到MySQL数据库（视频名字，大小，VID等等）就算上传完成，此时提示用户上传保存成功，状态转码中。

播放时候如果还在转码获取不到播放URL地址继续提示转码中字样，直到转码成功获取到播放地址URL为止，那么关键就是用户点击播放的时候根据VID调用阿里云API能够获取到播放URL时候（此时已经能获取到该VID对应视频所有信息）同时更新时间（默认时间0，毫秒单位），如果时间字段等于0就更新，否则认为已经获取到真实时间不必更新时间字段。

如果修改了视频更新VID和其他信息时候同时更新时间字段0毫秒，新视频获取时间同上方式重复。

终于完了。

给同学门个妹子欣赏作为结束