vue-实现rtmp直播流

news/2024/9/27 20:04:11 标签: vue.js

1、安装vue-video-player与videojs-flash

npm install vue-video-player -S

npm install videojs-flash --save

2、在main.js中引入

3、组件中使用

 

这样就能实现rtmp直播流在浏览器中播放,但有以下几点切记,不要入坑

1.安装vue-video-player插件一定要用npm安装,不可使用cnpm安装,否则会报:“The "flash" tech is undefined. Skipped browser support check for that tech”

2.如果需要播放 RTMP 流,需要安装 videojs-flash 插件

3.如果两个流都需要播放,flash 插件需要安装到 hls 插件之前

4.如果需要播放 HLS 流,需要安装 videojs-contrib-hls 插件,非原生支持的浏览器,直播服务端需要开启 CORS

5.如果你需要在谷歌浏览器播放,需要将谷歌浏览器的flash设置改成允许使用flash插件播放


http://www.niftyadmin.cn/n/5679433.html

相关文章

【CSS in Depth 2 精译_038】6.2 CSS 定位技术之:绝对定位

当前内容所在位置(可进入专栏查看其他译好的章节内容) 第一章 层叠、优先级与继承(已完结)第二章 相对单位(已完结)第三章 文档流与盒模型(已完结)第四章 Flexbox 布局(已…

轮播图组件更加完善版

依然是基于微博语法开发&#xff0c;使用时请注意标签替换 优化了滑动的效果&#xff0c;默认的索引&#xff0c;滑动距离等&#xff0c; 使用方式和以前一样没变&#xff0c;主要修改了组件内部 <template><wbx-view class"" style"width: 100vw;heig…

【企业微信】群机器人自动消息配置

0、群聊机器人 内部企微群聊可以添加一个机器人&#xff0c;这个机器人其实是个消息接口&#xff0c;可以外部脚本来自动定时发送消息到群里&#xff0c;打工人最有用的提醒就是每周提醒发周报了。 1、创建机器人 一般公司都没有人使用&#xff0c;我们可以手动创建一个。 …

观测云链路追踪分析最佳实践

背景 如果要在开发、运维和工程层面持续改进一个涉及多服务的应用&#xff0c;以链路追踪、日志检索、指标收集、用户体验监测、性能剖析、关联分析等作为代表性技术的可观测性必不可少&#xff0c;这一看法已成为共识&#xff0c;但在采用这项技术的过程中&#xff0c;如何分…

【数据结构】什么是二叉搜索(排序)树?

&#x1f984;个人主页:修修修也 &#x1f38f;所属专栏:数据结构 ⚙️操作环境:Visual Studio 2022 目录 &#x1f4cc;二叉搜索(排序)树的概念 &#x1f4cc;二叉搜索(排序)树的操作 &#x1f38f;二叉搜索树的查找 &#x1f38f;二叉搜索树的插入 &#x1f38f;二叉搜索树的…

Linux相关概念和重要知识点(8)(操作系统、进程的概念)

1.操作系统&#xff08;OS&#xff09; &#xff08;1&#xff09;基本结构的认识 任何计算机系统都包含一个基本的程序集合&#xff0c;用于实现计算机最基本最底层的操作&#xff0c;这个软件称为操作系统。操作系统大部分使用C语言编写&#xff0c;少量使用汇编语言。 从…

宝塔面板部署雷池社区版教程

宝塔面板部署雷池社区版教程 简单介绍一下宝塔面板&#xff0c;安全高效的服务器运维面板&#xff0c;使用宝塔面板的人非常多 在网站管理上&#xff0c;许多用户都是通过宝塔面板进行管理&#xff0c;宝塔面板的Nginx默认监听端口为80和443&#xff0c;这就导致共存部署时雷池…

【linux】轻松掌握文件管理:安装Ranger并设置Micro为默认编辑器

在Linux系统中&#xff0c;高效的文件管理和文本编辑是日常工作的重要组成部分。今天&#xff0c;我们将介绍如何安装强大的命令行文件管理器Ranger&#xff0c;并将现代化的终端文本编辑器Micro设置为默认编辑器。这个组合不仅能提高您的工作效率&#xff0c;还能让您的终端操…