这两天的一个小需求,需要实现桌面实时直播,前面讲了两种方式:

1、Windows 11实现录屏直播,搭建Nginx的rtmp服务 的方式需要依赖与Flash插件,使用场景有限

2、Windows 11实现直播,VLC超简单实现捕获、串流、播放 的方式需要依赖于播放器,也可以通过转换协议实现需求

现在讲第三种,通过 FFmpeg 切片推流 HLS,并嵌入 H5 的web页面实现桌面直播

需要工具去头一篇博客取,别客气,当自己家一样

开始叭

1、写个 Nginx 的配置文件

  在自己的nginx/cong文件夹下,新建一个 nginx-win-hls.conf 文件,内容如下:

worker_processes  2;

events {
worker_connections 8192;
} rtmp {
server {
listen 1935;
application live { #rtmp直播
live on;
}
application hls { #hls直播
live on;
hls on;
hls_path D:/live/nginx-1.7.11.3-Gryphon/hls/;
hls_fragment 5s;
}
chunk_size 4096; #数据传输块的大小
}
} http {
include mime.types;
default_type application/octet-stream; sendfile off; server_names_hash_bucket_size 128; client_body_timeout 10;
client_header_timeout 10;
keepalive_timeout 30;
send_timeout 10;
keepalive_requests 10; server {
listen 80;
server_name localhost;
index web/index.html; # 直播页 location /hls/ {
types{
application/vnd.apple.mpegurl m3u8;
video/mp2t ts;
}
alias D:/live/nginx-1.7.11.3-Gryphon/hls/;
expires -1;
} location /stat {
rtmp_stat all;
rtmp_stat_stylesheet stat.xsl;
}
location /stat.xsl {
root nginx-rtmp-module/;
}
location /control {
rtmp_control all;
} location / {
root D:/live/nginx-1.7.11.3-Gryphon;
index index.html index.htm;
} error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}

2、启动 Nginx,这里有问题去看头一篇文章

nginx.exe -c conf\nginx-win-hls.conf

3、启动FFmpeg,切片、保存

ffmpeg -f gdigrab -i desktop -vcodec libx264 -preset:v ultrafast -tune:v zerolatency -f hls -hls_time 5.0 -hls_list_size 1 -hls_wrap 20  D:\live\nginx-1.7.11.3-Gryphon\hls\tv.m3u8

  目录下会生成一个 tv.m3u8文件 + 一堆的 tv片,用过的会自动删除

4、写个H5的Web页面

  进入Nginx的html目录,新建 live-hls.html

<!DOCTYPE HTML>
<html> <head>
<title>Live - HLS</title>
<link rel="icon" href="./favicon.ico">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit" />
<meta name="force-rendering" content="webkit" />
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<script type="text/javascript" src="EasyPlayer-element.min.js"></script>
</head>
<body>
<easy-player video-url="/hls/tv.m3u8" live="true" aspect="400:300" debug="true"
isresolution="true" resolution="yh,fhd,hd,sd" resolutiondefault="yh"></easy-player>
</body>
</html>

5、见证奇迹

  浏览器输入:http://127.0.0.1/html/live-hls.html

  是的,此时我正在写博客

  哈? 

  白屏!没奇迹!对吧?给你的 js 就有了

链接:https://pan.baidu.com/s/1eqEW1G6kEOxKQ42kN_cyjw
提取码:3235

  好了,别客气。求个关注,常来哈

Windows11实现录屏直播,H5页面直播 HLS ,不依赖Flash的更多相关文章

  1. Windows实现桌面录屏、指定窗口录制直播,低延时,H5页面播放

    接着前面记录的3种方式实现桌面推流直播: 1.Windows 11实现录屏直播,搭建Nginx的rtmp服务 的方式需要依赖与Flash插件,使用场景有限 2.Windows 11实现直播,VLC超简 ...

  2. 基于EasyNVR+EasyDSS H5视频直播二次开发实现业务需求:直接使用播放页面

    之前的"网页直播.微信直播技术解决方案:EasyNVR与EasyDSS流媒体服务器组合之区分不同场景下的easynvr"有介绍一些功能.由于客户需求,我们定制一下功能.给该套方案添 ...

  3. 前端视频直播技术总结及video.js在h5页面中的应用

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...

  4. Windows 11实现录屏直播,搭建Nginx的rtmp服务

    先!下载几个工具呗 官方下载FFmpeg:http://www.ffmpeg.org 官方下载nginx-rtmp-module:https://github.com/arut/nginx-rtmp- ...

  5. 手游录屏直播技术详解 | 直播 SDK 性能优化实践

    在上期<直播推流端弱网优化策略 >中,我们介绍了直播推流端是如何优化的.本期,将介绍手游直播中录屏的实现方式. 直播经过一年左右的快速发展,衍生出越来越丰富的业务形式,也覆盖越来越广的应用 ...

  6. Android实现录屏直播(三)MediaProjection + VirtualDisplay + librtmp + MediaCodec实现视频编码并推流到rtmp服务器

    请尊重分享成果,转载请注明出处,本文来自Coder包子哥,原文链接:http://blog.csdn.net/zxccxzzxz/article/details/55230272 Android实现录 ...

  7. Android设备一对多录屏直播--(UDP组播连接,Tcp传输)

    原文:https://blog.csdn.net/sunmmer123/article/details/82734245 近期需要学习流媒体知识,做一个Android设备相互投屏Demo,因此找到了这 ...

  8. Android实现录屏直播(一)ScreenRecorder的简单分析

    http://blog.csdn.net/zxccxzzxz/article/details/54150396 Android实现录屏直播(一)ScreenRecorder的简单分析 Android实 ...

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

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

随机推荐

  1. Netty | 第1章 Java NIO 网络编程《Netty In Action》

    目录 前言 1. Java 网络编程 1.1 Javs NIO 基本介绍 1.2 缓冲区 Buffer 1.2 通道 Channel 1.3 选择器 Selector 1.4 NIO 非阻塞网络编程原 ...

  2. MapReduce07 Join多种应用

    目录 1 Join多种应用 1.1 Reduce Join 1.2 Reduce Join实例实操 需求 需求分析 Map数据处理 Reduce端合并(数据倾斜) 代码实现 JoinBean类 Joi ...

  3. 学习java 7.15

    学习内容: 进程:正在运行的程序 是系统进行资源分配和调用的独立单位 每个进程都有它自己的内存空间和系统资源 线程:是进程中的单个顺序控制流,是一条执行路径 单线程:一个进程如果只有一条执行路径,则称 ...

  4. 《Scala编程》课程作业

    第一题.百元喝酒 作业要求:每瓶啤酒2元,3个空酒瓶或者5个瓶盖可换1瓶啤酒.100元最多可喝多少瓶啤酒?(不允许借啤酒) 思路:利用递归算法,一次性买完,然后递归算出瓶盖和空瓶能换的啤酒数 /** ...

  5. Android Bitmap 全面解析(一)加载大尺寸图片

    压缩原因:1.imageview大小如果是200*300那么加载个2000*3000的图片到内存中显然是浪费可耻滴行为;2.最重要的是图片过大时直接加载原图会造成OOM异常(out of memory ...

  6. InnoDB的行锁模式及加锁方法

    MYSQL:InnoDB的行锁模式及加锁方法 共享锁:允许一个事务度一行,阻止其他事务获取相同数据集的排他锁. SELECT * FROM table_name WHERE ... LOCK IN S ...

  7. java foreach循环抛出异常java.util.ConcurrentModificationException

    代码如下: for (Iterator<String> iter = list.iterator(); iter.hasNext(); ) { if (Integer.parseInt(i ...

  8. 大数据处理系列之(一)Java线程池使用

    前言:最近在做分布式海量数据处理项目,使用到了java的线程池,所以搜集了一些资料对它的使用做了一下总结和探究, 前面介绍的东西大多都是从网上搜集整理而来.文中最核心的东西在于后面两节无界队列线程池和 ...

  9. MyBatis(4):使用limit实现分页

    用limit实现分页,首先要创建一个Maven项目,搭建好mybatis的实验环境,并且连接好数据库 代码 1,编写dao接口 UserMapper //查询全部用户实现分页 List<User ...

  10. 【JAVA今法修真】 第一章 今法有万象 百家欲争鸣

    大家好,我是南橘,因为这段时间很忙,忙着家里的事情,忙着工作的事情,忙着考试的事情,很多时候没有那么多经历去写新的东西,同时,也是看了网上一些比较新颖的文章输出方式,自己也就在想,我是不是也可以这样写 ...