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

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. 用C语言的LED实验,有汇编哦!

    C语言LED实验 1.汇编激活CPU 首先要明白对于没有系统开发板(也就是裸机)来说,是没办法直接对C进行识别.所以需要一段汇编语言,来配置CPU的资源,选择CPU运行模式,初始化指针位置. 代码如下 ...

  2. hbase调优

    @ 目录 一.phoenix调优 1.建立索引超时,查询超时 2.预分区 hbase shell预分区 phoenix预分区 3.在创建表的时候指定salting. 4.二级索引 建立行键与列值的映射 ...

  3. C语言中的字节对齐

    下面这个篇博客讲解很好 http://blog.csdn.net/meegomeego/article/details/9393783 总的来看分三类: 1. 不加 #pragma pack(n)伪指 ...

  4. Jenkins:参数化构建:分支|模块|回滚|打印日志

    @ 目录 多分支 安装Git Parameter Plug-In 配置参数 选择构建分支 分模块 前提 分模块build 参数配置 分模块shell脚本 mvn 的基本用法 分模块运行 Jenkins ...

  5. 4.2 rust 命令行参数

     从命令行读取参数 use std::env; fn main() { let args: Vec<String> = env::args().collect(); println!(&q ...

  6. 如何将List集合中相同属性的对象合并

    在实际的业务处理中,我们经常会碰到需要合并同一个集合内相同属性对象的情况,比如,同一个用户短时间内下的订单,我们需要将各个订单的金额合并成一个总金额.那么用lambda表达式和HashMap怎么分别处 ...

  7. 【Java 8】Stream通过reduce()方法合并流为一条数据示例

    在本页中,我们将提供 Java 8 Stream reduce()示例. Stream reduce()对流的元素执行缩减.它使用恒等式和累加器函数进行归约. 在并行处理中,我们可以将合并器函数作为附 ...

  8. IDEA 使用rest client测试

    一.进入 rest 控制台 idea 导航栏 ==> Tools ==> HTTP Client ==> Test RESTFUL Web Service 如图: 一般来说,idea ...

  9. 通过静态分析和持续集成 保证代码的质量 (Helix QAC)1

    前言 现代软件开发团队面临着很多挑战,这些挑战包括:产品交付期限越来越紧,团队的分布越来越广,软件的复杂度越来越高,而且对软件的质量要求越来越高. 本文分为两个章节.第一章讨论持续集成的原理,持续集成 ...

  10. java多线程4:volatile关键字

    上文说到了 synchronized,那么就不得不说下 volatile关键字了,它们两者经常协同处理多线程的安全问题. volatile保证可见性 那么volatile的作用是什么呢? 在jvm运行 ...