思路(如图):

1,开启推流服务器(这里我的Nginx-rtmp服务器搭建成功)

进入docker 开启推流服务器  docker run -it -p 1935:1935 -p 8000:80 --rm alfg/nginx-rtmp

2,推流(两种方法)

命令推流:

查看本机摄像头及麦克风设备 ffmpeg -list_devices true -f dshow -i dummy

音视频推流: ffmpeg -f dshow -i video="VMware Virtual USB Video Device":audio="Microphone (High Definition Audio Device)" -tune:v zerolatency -f flv "rtmp://192.168.99.100:1935/stream/test"

#推流视频文件
ffmpeg -re -stream_loop -1 -i test.mp4 -f flv rtmp://192.168.99.100:1935/stream/test
播放地址http://192.168.99.100:8000/live/test.m3u8 #将摄像头推流到hls
ffmpeg -f vfwcap -i "0" -c:v libx264 -preset ultrafast -acodec libmp3lame -ar 44100 -ac 1 -f flv rtmp://localhost:1935/hls/home
播放地址http://localhost:8080/hls/home.m3u8 #将屏幕推流到rtmp
start ffmpeg -f gdigrab -i desktop -vcodec libx264 -preset ultrafast -acodec libmp3lame -ar 44100 -ac 1 -f flv
播放地址rtmp://localhost:1935/live/jing

使用第三方软件推流:(例如:OBS Studio)

3,拉流

这里前端使用的是通过VUE

注意使用video需安装以下几个依赖

cnpm install video.js
cnpm install aes-decrypter
cnpm install m3u8-parser
cnpm install mpd-parser
cnpm install mux.js
cnpm install url-toolkit
cnpm install videojs-contrib-hls

<video id="my-video" class="video-js vjs-default-skin" controls preload="auto" >
<source src="http://192.168.99.100:8000/live/test.m3u8" type="application/x-mpegURL">
</video> <script>
//vue 的video插件
import videojs from 'video.js'
import 'videojs-contrib-hls' export default {
mounted:function(){
//自动执行直播平台
videojs('my-video', {
bigPlayButton: false,
textTrackDisplay: false,
posterImage: true,
errorDisplay: false,
controlBar: true
}, function () {
this.play()
})
}
}
} </script>

效果如下:

Nginx-rtmp+ FFmpeg +Docker + vue.js 直播系统搭建的更多相关文章

  1. nginx RTMP FFmpeg 视频直播

    /**************************************************************************** * nginx RTMP FFmpeg 视频 ...

  2. centos7+nginx+rtmp+ffmpeg搭建流媒体服务器(保存流目录与http目录不要随意配置,否则有权限问题)

    搭建nginx-http-flv-module升级代替rtmp模块,详情:https://github.com/winshining/nginx-http-flv-module/blob/master ...

  3. windows下vue.js开发环境搭建教程

    这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...

  4. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  5. H264音视频直播系统 服务器端+客户端源码 可用于直播系统搭建

    RTP协议实现直播系统搭建,采用H.264和AAC编码,码率极低,同时有较高的视频清晰度和音频音质,可用于视频聊天.视频会议.摄像头监控等多种应用场景. 直播系统搭建发布端,选择视频和音频设备,指定服 ...

  6. 利用Docker挂载Nginx-rtmp(服务器直播流分发)+FFmpeg(推流)+Vue.js结合Video.js(播放器流播放)来实现实时网络直播

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_75 众所周知,在视频直播领域,有不同的商家提供各种的商业解决方案,其中比较靠谱的服务商有阿里云直播,腾讯云直播,以及又拍云和网易云 ...

  7. ffmpeg,rtmpdump和nginx rtmp实现录屏,直播和录制

    公司最近在做视频直播的项目,我这里分配到对直播的视频进行录制,录制的方式是通过rtmpdump对rtmp的视频流进行录制 前置的知识 ffmpeg: 用于实现把录屏工具发出的视频和音频流,转换成我们需 ...

  8. (转)Nginx+rtmp+ffmpeg搭建流媒体服务器

    (1)下载第三方扩展模块nginx-rtmp-module # mkdir module && cd module //创建一个存放模块的目录 # wget https://githu ...

  9. windows平台简易直播系统搭建

    最近做直播系统的朋友很多,正好前端时间也在做这一块,写片文章分享下开发心得,以为后用. 直播系统我将它分为前堆推流,后台服务,客户端播放三大部分.前端推流基于ffmpeg,后台服务 使用crtmp服务 ...

随机推荐

  1. JDk8的新特性-流和内部iteration

    JDK8到今天已经出了好几年了  但是在公司能用到新特性的地方还是很少, 去年的时候当时项目老大要求我们用最新的写法来写Java 刚开始看到用stream写出来的代码一脸懵逼,内心就在想  这是Jav ...

  2. 关闭Win10窗口拖动到桌面边缘自动缩放功能

  3. html基础标签用法

    head title 行级双 网页标题标签 meta 单 存放网页重要信息,字符集,搜索索引,简介等(不显示) a 标签行内双标签 href="跳转路径", (JavaScript ...

  4. django+channels+dephne实现websockrt部署

    当你的django项目中使用channels增加了websocket功能的时候,在使用runserver命令启动时,既可以访问http请求,又可以访问websocket请求.但是当你使用uWSGI+n ...

  5. 老猿学5G扫盲贴:3GPP规范中与计费相关的主要规范文档列表及下载链接

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 老猿学5G博文目录 在<老猿学5G扫盲贴:3GPP规范中部分与计 ...

  6. PyQt(Python+Qt)学习随笔:QAbstractItemView的autoScroll和autoScrollMargin属性

    老猿Python博文目录 老猿Python博客地址 QAbstractItemView的autoScroll属性用于确认鼠标在视口边缘时是否自动滚动内容,默认值为True,autoScrollMarg ...

  7. 【聊技术】在Android中实现自适应文本大小显示

    本周的聊技术话题和大家说说如何在Android中实现自适应文本大小显示. 想象一下,在布局中,通常显示文本的区域大小是固定的,但是文本长度并不总是固定的.比如列表中的文章标题.界面下方的按钮文本等等. ...

  8. Day1 【Scrum 冲刺博客】

    (因发作业当天没注意看作业内容,第一天的冲刺博客和第二天的同时发!!!不好意思!!!) 各个成员在 Alpha 阶段认领的任务 方晓莹 搭建社区管理系统的前端框架 登录页开发 管理员模块个人中心开发 ...

  9. 【题解】P2610 [ZJOI2012]旅游

    link 题意 T国的国土可以用一个凸N边形来表示,包含 \(N-2\) 个城市,每个城市都是顶点为 \(N\) 边形顶点的三角形,两人的旅游路线可以看做是连接N个顶点中不相邻两点的线段.问一路能经过 ...

  10. 题解-NOI2016 优秀的拆分

    NOI2016 优秀的拆分 \(T\) 组测试数据.求字符串 \(s\) 的所有子串拆成 \(AABB\) 形式的方案总和. 数据范围:\(1\le T\le 10\),\(1\le n\le 3\c ...