您好,登錄后才能下訂單哦!
這篇文章主要介紹了html5支不支持flv文件的相關(guān)知識(shí),內(nèi)容詳細(xì)易懂,操作簡(jiǎn)單快捷,具有一定借鑒價(jià)值,相信大家閱讀完這篇html5支不支持flv文件文章都會(huì)有所收獲,下面我們一起來(lái)看看吧。
html5不支持flv格式的文件;video標(biāo)簽原生是不支持flv格式文件的,但是可以通過(guò)安裝相關(guān)的插件來(lái)進(jìn)行支持,flv是“FLASH VIDEO”的簡(jiǎn)稱,F(xiàn)LV流媒體格式是隨著“Flash MX”的推出發(fā)展而來(lái)的視頻格式。
本教程操作環(huán)境:windows10系統(tǒng)、HTML5版本、Dell G3電腦。
HTML5的video標(biāo)簽原生是不支持flv格式文件的,但是可以安裝相關(guān)插件來(lái)進(jìn)行支持。FLV 是FLASH VIDEO的簡(jiǎn)稱,F(xiàn)LV流媒體格式是隨著Flash MX的推出發(fā)展而來(lái)的視頻格式。由于它形成的文件極小、加載速度極快。
目前主流瀏覽器不能直接嵌入并且播放FLV文件,所以直接用video標(biāo)簽播放是行不通的。
因此提供兩種解析方法
嵌入一個(gè)swf媒體播放文件,并利用該文件來(lái)播放你預(yù)設(shè)的文件。
這里推薦dplayer(親測(cè)同樣好用)
利用B站開(kāi)源的flv.js,通過(guò)將FLV文件流轉(zhuǎn)換為ISO BMFF(Fragmented MP4)段,然后通過(guò)Media Source Extensions API 將mp4段提供給HTML5 元素。
flv.js是支持在 HTML5 視頻中播放 FLV 格式視頻的 JavaScript 庫(kù)。使用 ES6 編寫的,如果低版本兼容需要通過(guò) Babel編譯一下
這里僅展示實(shí)現(xiàn)demo
安裝
npm install --save flv.js
元素
<template> <div> <video id="videoElement" controls autoplay muted width="300px" height="200px"> </video> <button @click="play">播放</button> </div> </template>
代碼
import flvjs from 'flv.js' export default { data () { return { flvPlayer:null } }, mounted() { if (flvjs.isSupported()) { var videoElement = document.getElementById('videoElement'); this.flvPlayer = flvjs.createPlayer({ type: 'flv', isLive: true, hasAudio: false, url: 'http://1011.hlsplay.aodianyun.com/demo/game.flv' }); this.flvPlayer.attachMediaElement(videoElement); this.flvPlayer.load(); this.flvPlayer.play(); } }, methods:{ play () { this.flvPlayer.play(); } } }
關(guān)于“html5支不支持flv文件”這篇文章的內(nèi)容就介紹到這里,感謝各位的閱讀!相信大家對(duì)“html5支不支持flv文件”知識(shí)都有一定的了解,大家如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。