flv.js的具體使用教程
簡(jiǎn)介
Flv.js 是 HTML5 Flash 視頻(FLV)播放器,純?cè)?JavaScript 開(kāi)發(fā),沒(méi)有用到 Flash。由 bilibili 網(wǎng)站開(kāi)源。它的工作原理是將 FLV 文件流轉(zhuǎn)碼復(fù)用成 ISO BMFF(MP4 碎片)片段,然后通過(guò) Media Source Extensions 將 MP4 片段喂進(jìn)瀏覽器。
媒體部分
配置
flv.js常用方法
1:flvjs.isSupported():判斷當(dāng)前瀏覽器是否支持播放
2:flvPlayer = flvjs.createPlayer(mediaDataSource: MediaDataSource, config?: Config):創(chuàng)建一個(gè)播放實(shí)例
3:flvPlayer.attachMediaElement(mediaElement: HTMLMediaElement):將播放實(shí)例注冊(cè)到video節(jié)點(diǎn)
4:flvPlayer.load():加載數(shù)據(jù)流
5:flvPlayer.play():播放數(shù)據(jù)流
6:flvPlayer.pause():暫停播放數(shù)據(jù)流
7:flvPlayer.unload():取消數(shù)據(jù)流加載
8:flvPlayer.detachMediaElement():將播放實(shí)例從節(jié)點(diǎn)中取出
9:flvPlayer.destroy():銷毀播放實(shí)例
flv.js簡(jiǎn)單使用
1:html
<video id="my-player" preload="auto" muted autoplay type="rtmp/flv"> <source src=""> </video>
2:js
(1):在index.xml文件中引入flv.js
<script src="./flv.js/flv.min.js"></script>
(2):使用flv.js實(shí)現(xiàn)播放flv格式流,獲取video節(jié)點(diǎn)
videoElement = document.getElementById('my-player'); if (flvjs.isSupported()) { flvPlayer = flvjs.createPlayer({ type: 'flv', //媒體類型 url: 'XXXX' //flv格式媒體URL isLive: true, //數(shù)據(jù)源是否為直播流 hasAudio: false, //數(shù)據(jù)源是否包含有音頻 hasVideo: true, //數(shù)據(jù)源是否包含有視頻 enableStashBuffer: false //是否啟用緩存區(qū) },{ enableWorker: false, //不啟用分離線程 enableStashBuffer: false, //關(guān)閉IO隱藏緩沖區(qū) autoCleanupSourceBuffer: true //自動(dòng)清除緩存 }); flvPlayer.attachMediaElement(videoElement); //將播放實(shí)例注冊(cè)到節(jié)點(diǎn) flvPlayer.load(); //加載數(shù)據(jù)流 flvPlayer.play(); //播放數(shù)據(jù)流 }
(3):關(guān)閉視頻流
flvPlayer.pause(); //暫停播放數(shù)據(jù)流 flvPlayer.unload(); //取消數(shù)據(jù)流加載 flvPlayer.detachMediaElement(); //將播放實(shí)例從節(jié)點(diǎn)中取出 flvPlayer.destroy(); //銷毀播放實(shí)例
到此這篇關(guān)于flv.js的具體使用教程的文章就介紹到這了,更多相關(guān)flv.js使用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
js編碼之encodeURIComponent使用介紹(asp,php)
因此對(duì)于JS腳本又重新研究了一下。在對(duì)新的URL編碼的時(shí)候發(fā)現(xiàn),網(wǎng)頁(yè)編碼的格式對(duì)于JS的影響很大,在這里書寫一點(diǎn)2012-03-035秒后跳轉(zhuǎn)到另一個(gè)頁(yè)面的js代碼
跳轉(zhuǎn)到另一個(gè)頁(yè)面的方法有很多,在本文將為大家詳細(xì)介紹下js中如何實(shí)現(xiàn)5秒后跳轉(zhuǎn)到另一個(gè)頁(yè)面,感興趣的朋友可不要錯(cuò)過(guò)2013-10-10ES6知識(shí)點(diǎn)整理之函數(shù)數(shù)組參數(shù)的默認(rèn)值及其解構(gòu)應(yīng)用示例
這篇文章主要介紹了ES6知識(shí)點(diǎn)整理之函數(shù)數(shù)組參數(shù)的默認(rèn)值及其解構(gòu)應(yīng)用,結(jié)合實(shí)例形式分析了ES6函數(shù)數(shù)組參數(shù)解構(gòu)賦值和默認(rèn)值的設(shè)置相關(guān)操作技巧,需要的朋友可以參考下2019-04-04css 二級(jí)菜單 實(shí)現(xiàn)代碼集合 修正版
最近的網(wǎng)站要求使用二級(jí)菜單,本著“能用別人的就用別人的,不能用別人的就用自己的”的原則,在網(wǎng)上找到一個(gè)經(jīng)典的使用CSS制作的二級(jí)菜單,感覺(jué)不錯(cuò),先記錄下來(lái),以備它用。2009-06-06分別用marquee和div+js實(shí)現(xiàn)首尾相連循環(huán)滾動(dòng)效果,僅3行代碼
這是本人2007年進(jìn)行的一項(xiàng)研究,當(dāng)時(shí)網(wǎng)絡(luò)上沒(méi)有什么既精簡(jiǎn)又實(shí)用的循環(huán)滾動(dòng)代碼,所以就自己琢磨了段時(shí)間,最終找到這個(gè)辦法2011-09-09javascript?Echart可視化學(xué)習(xí)
這篇文章主要為大家介紹了Echart可視化學(xué)習(xí)的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來(lái)幫助2022-01-01TypeScript利用TS封裝Axios實(shí)戰(zhàn)
這篇文章主要介紹了TypeScript利用TS封裝Axios實(shí)戰(zhàn),TypeScript封裝一遍Axios,能進(jìn)一步鞏固TypeScript的基礎(chǔ)知識(shí),需要的小伙伴可以參考一下2022-06-06