同时支持mp4/ogg/webm/flv格式的视频播放

最近项目里要求支持多格式视频上传和播放，用的是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格式的插件还没找到，谁有可用的插件或方法可以推荐一下

同时支持mp4/ogg/webm/flv格式的视频播放相关推荐

flv.js 插件完成 flv 格式的视频播放
记录--- api中文文档: flv.js 中文API文档 - 简书参考文章:全网最详细!vue中使用flv.js 播放直播监控视频流_vue使用flv.js_抄一下你代码的博客-CSDN博客问题 ...
ffplay flv mp4 转_FFmpeg将mp4转成flv
mp4转成flv格式文件步骤如下: 1.打开输入文件,创建输入文件和输出文件的上下文环境 2.遍历输入文件的每一路流,每个输入流对应创建一个输出流,将输入流中的编解码参数直接拷贝到输出流中. 3.文件 ...
FFmpeg将mp4转成flv
mp4转成flv格式文件步骤如下: 1.打开输入文件,创建输入文件和输出文件的上下文环境 2.遍历输入文件的每一路流,每个输入流对应创建一个输出流,将输入流中的编解码参数直接拷贝到输出流中. 3.文件 ...
Qt视频播放器(支持mp4/mkv/wmv/avi)
Qt基于QMediaPlayer实现视频播放目前支持mp4/mkv/wmv/avi格式并支持进度条拖动播放打开文件扫描视频 void MainWindow::scanVideoFiles() { ...
php f4v元数据,IIS设置支持flv,f4v,mp4,ogv,webm
IIS设置支持flv,f4v,mp4,ogv,webm #IIS服务器的添加视频支持方法以配置支持flv格式为例在iis的Internet信息服务(2003)点击右键或指定的网站上(高版本的II ...
IIS设置支持flv,f4v,mp4,ogv,webm
flv格式是加入关联扩展名: .flv,内容类型:application/octet-stream f4v格式是扩展名: .f4v,内容类型:application/oc ...
fwPlayer 支持最新浏览器在线播放AVI和FLV格式的视频
fwPlayer 支持最新浏览器在线播放AVI和FLV格式的视频可以使用 fwPlayer 使用webassembly技术,在线转码avi flv为mp4 或者ogg等来播放 fwPlayer 支持 ...
html播放mov格式视频,jQuery及video标签视频播放弹窗插件支持mp4,mov等格式详解(图文)...
在做html5做播放视频时,如果是mp4,ogg,webm等视频格式,用h5自带的video标签就可以实现,但苹果的mov格式视频video标签是不支持的. h5实现mp4视频播放:video标签仅支 ...
flv格式怎么转换成mp4，一键快速转换视频格式
flv格式怎么转换成mp4?关于视频格式的转换方法和软件网上实在太多了,因为各个软件水平参差不齐,导致大家用各个软件转换出来的格式效果也不尽相同,同时因为网上输入关于flv转mp4关键词的不同,也注定 ...

同时支持mp4/ogg/webm/flv格式的视频播放

同时支持mp4/ogg/webm/flv格式的视频播放相关推荐

最新文章

热门文章