html5视频加载的简单介绍

使用html5 video播放的视频加载很慢怎么优化

video autoplay="autoplay" loop="loop" src="video.ogg"/video

创新互联是专业的滑县网站建设公司，滑县接单;提供网站设计制作、成都网站建设,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行滑县网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

autoplay:当视频准备就绪就开始播放（不需要完全下载好，只要准备好了能播的时候就会马上播）

loop：循环播

可以缩短视频的大小，通过压缩缩短码率等方法。

还有可以通过其他视频插件去实现向jplayer~

safari浏览器，无论桌面还是safari的模拟响应式模式，还是真机上(h5,hybird)，都会有几率的报这个错。不是每次都报错嗷，但是10次里面有5-6次不是加载不出来，就是要等30s+。

failed to load resource: the network connection was lost.

加载失败:网络连接已中断

如果你也遇到safari里面的video加载请求 206 网络连接中断啥的，可以先curl看下服务器支持分段加载不，因为safari要求必须要支持分段才行。如果可以分段，也是七牛CDN资源，看下缓存配置，视频资源是否回源了，七牛是有限制的。把七牛的缓存调整成1个月再试试~~

在js中使用document.getElementById("video")获取视频元素，加监听addEventListener("ended",

function

()

{

//要执行的函数内容

});

最近几周都在弄这个

new个video，指定播放列表的第一个视频路径为src。监听end事件，回调里面把video的src改成列表的下一个，再play

代码示例：

var vList = ['视频地址url1', 'url2', '...']; // 初始化播放列表

var vLen = vList.length; // 播放列表的长度

var curr = 0; // 当前播放的视频

var video = new Video();

video.addEventListener('end', play);

play();

function play(e) {

video.src = vList[curr];

video.load(); // 如果短的话，可以加载完成之后再播放，监听 canplaythrough 事件即可

video.play();

curr++;

if (curr = vLen) curr = 0; // 播放完了，重新播放

}

可以实现html5 播放多个视频。一个接一个的播放

当前文章：html5视频加载的简单介绍
网站网址：http://scyanting.com/article/phciip.html