请注意,本文编写于 1726 天前,最后修改于 1529 天前,其中某些信息可能已经过时。
1. 切记:安装vue-video-player插件一定要用npm安装,不可使用cnpm安装,否则会报下面这个错误
“The "flash" tech is undefined.
Skipped browser support check for that tech”
Skipped browser support check for that tech”
2. 将vue-video-player播放器的语言设置为中文
import 'video.js/dist/lang/zh-CN'; // 手动引入中文js文件
videoOption 里设置
language: 'zh-CN'
3. 播放rtmp流和hls流
如果需要播放 RTMP
流,需要安装 videojs-flash
插件
如果需要播放 HLS
流,需要安装 videojs-contrib-hls
插件,非原生支持的浏览器,直播服务端需要开启 CORS
如果两个流都需要播放,flash
插件需要安装到 hls
插件之前
ps:
vue-video-player中已经安装了这两个插件,在vue文件里直接import 即可
import 'videojs-flash'
import 'videojs-contrib-hls'
4. 切换或者设置视频流地址sources.src
使用如下方法:
通过ref引用组件video-player
this.$refs[`videoPlayer`][0].player.src(videoUrl)
this.$refs[`videoPlayer`][0].player.load(videoUrl)
有时候使用上面的操作切换了视频流地址,但是视频画面仍然不会变 (卡住),
解决方法就是改变
看到另一种解决方法是直接更改该组件的
解决方法就是改变
v-if
为 false ,再改变为 true(在nextTick里) 将 video-player
先销毁再重建。看到另一种解决方法是直接更改该组件的
key
触发重新渲染,大家也可以尝试下附上 vue-video-player
插件原项目的 git
地址 vue-video-player
9 条评论
想想你的文章写的特别好https://www.237fa.com/
怎么收藏这篇文章?
看的我热血沸腾啊https://www.jiwenlaw.com/
你好,报错VIDEOJS: ERROR: The "flash" tech is undefined. Skipped browser support check for that tech.是什么问题呢
这是在github上找到的另一种解决方法,可以尝试下
不管是删除node_module还是cnpm都不是根本的解决方案,
根本原因是videojs和videojs-flash里的各有一个video.js,如果两个版本不一样可能就会报错了,终极解决方案就是配置第三方模块的查找顺序,优先查找本身安装的videojs就可以了
webpack.config.js
```
resolve: {
modules: [path.resolve('node_modules'), 'node_modules'],
...
}
```
第4个有用
终极销毁重启