1.什么是M3U8
最近做播放器，后臺給的鏈接是M3U8格式的，一臉懵逼，查了一些資料才了解m3u8是蘋果公司推出一種視頻播放標準，是m3u的一種，不過 編碼方式是utf-8，是一種文件檢索格式，將視頻切割成一小段一小段的ts格式的視頻文件，然后存在服務(wù)器中（現(xiàn)在為了減少I/o訪問次數(shù)，一般存在服務(wù)器的內(nèi)存中），通過m3u8解析出來路徑，然后去請求。
這樣每次請求很小有段視頻，可以做到近似于實時播放的效果。
發(fā)個示例鏈接：http://cdn.can.cibntv.net/12/201702161000/rexuechangan01/rexuechangan01.m3u8 給大家研究研究
第一層
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=2650800,RESOLUTION=1920x1080
1.m3u8
觀察數(shù)據(jù)嗎，沒有用http://開頭時，不是真正路徑，需要拼接字符串再次請求：http://cdn.can.cibntv.net/12/201702161000/rexuechangan01/1.m3u8 得到數(shù)據(jù)
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-TARGETDURATION:14
#EXTINF:11.480,
20170215T224129-1-0.ts
#EXTINF:11.480,
20170215T224129-1-1.ts
#EXTINF:10.480,
20170215T224129-1-2.ts
#EXTINF:11.400,
20170215T224129-1-3.ts
#EXTINF:11.120,
20170215T224129-1-4.ts
#EXTINF:11.200,
20170215T224129-1-5.ts
#EXTINF:13.600,
20170215T224129-1-6.ts
#EXTINF:11.360,
20170215T224129-1-7.ts
#EXTINF:10.240,
20170215T224129-1-8.ts
#EXTINF:12.000,
20170215T224129-1-9.ts
#EXTINF:13.760,
20170215T224129-1-10.ts
#EXT-X-ENDLIST
看到ts結(jié)尾的文件，這才是視頻真正的存放路徑：http://cdn.can.cibntv.net/12/201702161000/rexuechangan01/20170215T224129-1-0.ts ，這時候用瀏覽器下載就可以播放。不過這個播放不用我們?nèi)ソ馕?android 4.0以后的videoView 就支持自動解析，并拼接播放。
2.簡單的m3u8播放示例（網(wǎng)絡(luò)播放）
Uri uri = Uri.parse("http://cdn.can.cibntv.net/12/201702161000/rexuechangan01/rexuechangan01.m3u8");
video_view.setMediaController(new MediaController(this));
video_view.setVideoURI(uri);
video_view.requestFocus();
ideo_view.start();
這樣就可以簡單的播放M3u8格式的視頻了。
M3U8為mac專有的視頻格式, mac\ios下的瀏覽器都支持M3U8的html5播放，CKplayer也可以的。在PC上用flash播放，移動端就用h5
ckplayer 如何在PC上完美支持 m3u8播放
使用過ckplayer的同學(xué)都知道，相對jwplayer等，它非常的容易配置和使用。功能也是基本滿足我們的需求的。
一般情況我們都使用普通的視頻格式比如mp4,flv等播放，但如果視頻文件過大，會加載較慢。
于是我們可以將視頻轉(zhuǎn)成m3u8格式來解決這個問題（可以百度m3u8來了解原理，簡單點說他就是把視頻切成若干個切片，每個切片都可以獨立播放而且大小很小，然后利用一個文件索引來依次播放這些文件，所以很快）
但是PC上使用video 播放m3u8 是不支持的。幸好的是ckplayer有支持m3u8在PC播放的插件。
但注意了。有個巨坑，千萬不要根據(jù)ckplayer官網(wǎng)的說明去安裝配置這個插件！會出現(xiàn)各種錯誤！
其實很簡單，下載插件：m3u8.swf http://bbs.ckplayer.com/forum.php?mod=viewthread&tid=18168
下載后解壓，將m3u8.swf文件拷貝至你的服務(wù)器任意目錄，可以訪問到就好，為了方便我是放在了ckplyer插件文件夾里。
OK！配置成功！ 是不是很簡單？就拷貝過來就OK啦！
接下來是js:
showPlayer('http://static.guojiang.tv/pc/video/sound/1/playlist.m3u8','videoWrap')
function showPlayer(src, id){
//player
var flashvars={
f : 'http://static.guojiang.tv/pc/js/ckplayer/m3u8.swf',
a : src,
c : 0,
s:4,
lv:0//注意，如果是直播，需設(shè)置lv:1
};
var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'};
var video=[src];
CKobject.embed('http://static.guojiang.tv/pc/js/ckplayer/ckplayer.swf',id ,'ck-video','100%','100%',false, flashvars ,video, params);
}
f: m3u8.swf 的地址
a: 你要播放的m3u8視頻地址
至此，大功告成！
============================
切記：不要跟著官網(wǎng)的步驟做！切記！
在瀏覽器上播放m3u8的視頻地址有兩種方式：
-
html的video標簽的方式，這種方式播放很簡單:
<html>
<head>
<title>the5fire m3u8 test</title>
</head>
<body>
<video controls autoplay >
<source src="http://stream.gravlab.net/003119/sparse/v1d30/posts/2014/barcelona/barcelona.m3u8">
</video>
</body>
</html>
上面的代碼，你直接貼到一個index.html中，用safari瀏覽器打開就可以直接播了。
但是, 目前只能只有Safari支持，通用性并不好。因此還得采用flash來播放，也就下面的第二種方法。
-
通過開源的swfobject.js以及兩個flash組件：OSMF和HLSProvider來播放，上代碼:
<html>
<head>
<title>the5fire m3u8 test</title>
<script src="http://the5fireblog.b0.upaiyun.com/staticfile/swfobject.js"></script>
</head>
<body>
<div id="player">
</div>
<script>
var flashvars = {
src: escape("http://www.the5fire.com/static/demos/diaosi.m3u8"),
plugin_m3u8: "http://www.the5fire.com/static/demos/swf/HLSProviderOSMF.swf",
};
var params = {
allowFullScreen: true,
allowScriptAccess: "always",
bgcolor: "#000000"
};
var attrs = {
name: "player"
};
swfobject.embedSWF(
"http://www.the5fire.com/static/demos/swf/StrobeMediaPlayback.swf",
"player",
"800", "485",
"10.2",
null, flashvars, params, attrs
);
</script>
</body>
</html>
通過這三個東西的配合就可以播m3u8了，結(jié)果很簡單，但是對于我這個對flash外行的人來說還是搜索嘗試了良久的。這個代碼通過瀏覽器訪問文件的方式是不能用的，你得起一個web服務(wù)比如：python -m SimpleHTTPServer。然后訪問你存的index.html就能工作了。
結(jié)果是不是很簡單？不過在搜索的時候也找不到有人提供這樣的方案，反而找到很多基于OSMF而開發(fā)的收費的flash播放器?；谶@三個組件，我自己也做了個簡單的頁面，方便以后在網(wǎng)上看m3u8的視頻: m3u8 player
上面幾個開源項目的地址：
