11

ios3以上视频处理有一些不错的特性:

1、自适应码率

2、视频切片

测试目的:是否能在html5以及flash播放器中实现这些特性?

先用ffmpeg对源视频编码

ffmpeg -y -i test.avi -f mpegts -acodec libmp3lame -ar 48000 -ab 64k -vcodec libx264 -b 250k \

-flags +loop -cmp +chroma -partitions +parti4x4+partp8x8+partb8x8 -subq 5 -trellis 1 -refs 1 \

-coder 0 -me_range 16 -keyint_min 25 -sc_threshold 40 -i_qfactor 0.71 \

-bt 250k -maxrate 250k -bufsize 250k -rc_eq ‘blurCplx^(1-qComp)’ \

-qcomp 0.6 -qmin 10 -qmax 51 -qdiff 4 -level 30 -aspect 320:240 -g 30 -async 2 a.ts

安装开源segmenter视频切片工具,接下来对单一视频进行切片,10秒一个文件

./segmenter a.ts 15 a a.m3u8 http://mysite/test/

nginx配置加入:

application/x-mpegURL                 m3u8;

video/MP2T                            ts;

 

完成之后访问 http://mysite/test/a.m3u8 ,用itouch设备播放正常,chrome浏览器无法播放。

结论,只有ios设备能播放,html5播放不能,flash播放不能。


较好的方案是根据用户访问设备来进行兼容,非iPhone用户则使用播放mp4,测试页面代码(来自akamai):

<html>

<head>

<script type=”text/javascript”>

function isiphone(){

return ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) != null;

}

function init(){

if (!isiphone()){

document.getElementById(“videotag”).src =”http://mysite/test/a.mp4″;

 

}else{

document.getElementById(“videotag”).src = “http://mysite/test/a.m3u8″;

}

}

</script>

</head>

<body onload=”init()” >

<video id=”videotag” width=”400″ height=”224″ controls=”controls” >

<!– Fall-through to Quicktime object –>

<object width=”400″ height=”224″ type=”video/quicktime” data=”http://mysite/test/a.m3u8″ >

<param name=”controller” value=”true” />

<!– Fall-through to Install message –>

<a href=”[link to preferred runtime install..]“>

Click here to install support for this content.

</a>

</object>

</video>

</body>

</html>

 

自适应码率:

只有ios和safari浏览器支持,通过m3u8定义文件选择带宽对应的m3u8播放列表。

 

设想:

是否可以通过flash播放器编写特定代码读取m3u8列表文件,挨个播放视频切片文件?

 

参考:

http://www.ioncannon.net/programming/452/iphone-http-streaming-with-ffmpeg-and-an-open-source-segmenter/

 

preload preload preload