最近項目裏要求支持多格式視頻上傳和播放,用的是H5的video標籤,但video只支持三種格式mp4/ogg/webm這三種。實際需求要求同時也要支持flv/avi/rmvb這三種格式。
到目前只找到能支持flv這種格式的插件,github地址:https://github.com/bilibili/flv.js
1、在vue項目中,下載安裝依賴包
npm install --save flv.js
2、在當前使用頁面中引入 import flv from 'flv.js'
3、頁面結構,判斷如果是flv格式就用flv播放器播放,否則就是用 h5video 播放器播放
4、詳情頁面獲取後臺數據返回的視頻格式後綴和url視頻播放路徑,進行判斷渲染不同的結構,如果是flv格式,就調用方法傳入格式類型和url路徑初始化視頻容器,否則就把url路徑動態賦值給h5的video標籤
5、定義初始化flv視頻容器的方法
這樣只要後臺給返回相應的數據,就可以根據視頻後綴判斷不同的視頻類型,用不同的播放器播放了
另外avi和rmvb格式的插件還沒找到,誰有可用的插件或方法可以推薦一下