video.js 视频截图、录制、自定义全屏，hls、flv、mp4视频播放

功能

• video.js内嵌 截图、录制功能 （图片、视频会下载到本地）
• 自定义全屏
• 播放hls、flv、mp4
• 功能集合成Vue组件

参考

• video.js components
• RecordRTC demo
• video 截图并下载
• video.js添加自定义组件的方法
• 使用RecordRTC对video视频进行录制

效果

代码

源码

一些问题-速率功能消失

// vue-components-demo/src/components/player
/index.vue 下 getVideo方法内
// 重置播放器
this.player.reset()

就是因为我调用了reset方法所以导致速率功能消失。
想要倍数功能出现把这个方法注释就好，也可以直接在方法后面自己添加速率的方法

this.player.playbackRates([1, 2, 4, 6]);。

之前写的时候发现切换视频路径，从有数据的路径切换到空，发现后台还在请求，所以就加上reset