常见的直播三大协议 RTMP 协议为流媒体而设计,在推流中用的比较多,同时大多 CDN 厂商支持RTMP 协议。...它的实时性和 RTMP 相等,与 RTMP 相比又省去了部分协议交互时间,首屏时间更短,可拓展的功能也更多。...想通过html来播放直播视频可以吗? 我们知道在H5中,video标签是用来播放视频的。但是它仅仅解析mp4 avi等常见的格式。而flv m3u8等格式是不支持的。如何解决呢?...认识flv.js 一个实现了在 HTML5 视频中播放 FLV 格式视频的 JavaScript 库。...(HTML5 原生仅支持播放 mp4/webm 格式,不支持 FLV) ✍代码示例 首先,我们需要先引入flv.js <script src="https://cdn.bootcss.com/<em>flv.js</em>
现在,RTMP支持HEVC出新标准了,详见Enhanced RTMP。这个标准定义了一个新的codec ID,用于HEVC,即fourCC hvc1, OBS和SRS都支持这个标准。...What’s Next FFMpeg不支持RTMP的HEVC,但是一些维护者正在努力中了。...你可以给FFmpeg打补丁,支持RTMP的HEVC,参考FFmpeg HEVC SRS支持HEVC WebRTC,支持的是Safari浏览器,但SRS不支持RTMP转WebRTC,我们正在开发中了。...One More Thing 往事如烟,6年前给FFmpeg提过FFmpeg RTMP HEVC,但是当时FFmpeg社区说RTMP标准没有支持,所以FFmpeg也不支持。...其实后来给Adobe写过邮件,问过是否RTMP会更新的问题。Adobe回复说正在考虑更新RTMP标准。这一考虑就是6年过去了,不过终于也支持了。
常见直播协议 RTMP: 底层基于TCP,在浏览器端依赖Flash。 HTTP-FLV: 基于HTTP流式IO传输FLV,依赖浏览器支持播放FLV。...20s 205M 3% 在支持浏览器的协议里,延迟排序是: RTMP = HTTP-FLV = WebSocket-FLV < HLS 而性能排序恰好相反: RTMP > HTTP-FLV = WebSocket-FLV...flv.js兼容方案 由于目前flv.js兼容性还不是很好,要用在产品中必要要兼顾到不支持flv.js的浏览器。...不支持 flv.js 就使用 Flash播放器播 RTMP 流。Flash兼容性很好,但是性能差默认被很多浏览器禁用。...不支持 flv.js 就使用 HLS,但是 HLS延迟非常大。 HLS 也不支持就没法直播了,因为移动端都不支持Flash。
常见直播协议 RTMP: 底层基于TCP,在浏览器端依赖Flash。 HTTP-FLV: 基于HTTP流式IO传输FLV,依赖浏览器支持播放FLV。...20s 205M 3% 在支持浏览器的协议里,延迟排序是: RTMP = HTTP-FLV = WebSocket-FLV < HLS 而性能排序恰好相反: RTMP > HTTP-FLV =...flv.js兼容方案 由于目前flv.js兼容性还不是很好,要用在产品中必要要兼顾到不支持flv.js的浏览器。...不支持 flv.js 就使用 Flash播放器播 RTMP 流。Flash兼容性很好,但是性能差默认被很多浏览器禁用。...不支持 flv.js 就使用 HLS,但是 HLS延迟非常大。 HLS 也不支持就没法直播了,因为移动端都不支持Flash。
延时 低 低 高 高 数据分段 连续流 连续流 切片文件 切片文件 Html5播放 可通过html5解封包播放(flv.js) 不支持 可通过html5解封包播放(hls.js) 如果dash文件列表是...http_flv是一个无限大的http流的文件,相比rtmp就只能直播,而rtmp还可以推流和更多的操作。但是http有个好处,就是是以80http通信的,穿透性强,而且rtmp是非开放协议。.../flv.js?...---- 判断flv.js在手机端是否支持点播和httpflv直播: 是否支持点播视频:flvjs.getFeatureList().mseFlvPlayback 是否支持httpflv直播流:flvjs.getFeatureList...().mseLiveFlvPlayback 目前测试结果: ios :均不支持,包括微信和safari 安卓:微信均不支持;其他浏览器部分支持点播,全部不支持直播
整个架构如下图所示,分为服务器端和浏览器端两部分: websocket.png 方案二:RTSP转RTMP到RTMP服务器,转http-flv,播放端用flv.js播放 flv.js在获取到FLV格式的音视频数据后将...flv.js 从服务器获取FLV再解封装后转给Video标签的原因如下: 兼容目前的直播方案:目前大多数直播方案的音视频服务都是采用FLV容器格式传输音视频数据。...方案三:RTSP转RTMP到RTMP服务器,转hls,播放端用video.js播放 Video.js是一款web视频播放器,支持html5和flash两种播放方式。...插件形式的优点是无需二次转换,直接通过ActiveX控件的形式播放,延迟非常低,缺点是只支持IE浏览器。...方案五:RTSP转WebRTC播放 浏览器对webrtc的支持良好,特别是在H264编码方面几个主流的浏览器都已经支持了。
RTMP要支持H.265,大家约定俗成的做法是扩展flv协议,CDN厂商携手给出的解决方案是给flv的videotag CodecID增加一个新类型(12)来表示h265(hevc),和h264不同的地方是要解析...技术实现本文以大牛直播SDK的Windows平台RTMP直播推送和RTMP直播播放模块为例,考虑到老的扩展CodecID 12的场景依然使用,我们添加了个设置接口:RTMP推送端,对应文件为SmartPublisherSDK...1,那就是扩展头,Enhanced-Rtmp格式。...推流URL,实现Enhanced RTMP推送,播放端拉流播放,整体延迟如下:可以看到,尽管开启了Enhanced RTMP,整体延迟还在毫秒级。...技术总结鉴于目前RTMP扩展265这块,大多还是用的老的CodecID设置为12的模式,如果需要支持新的Enhanced RTMP,除了推送端和播放端外,RTMP服务端也需要做响应的调整,来适配这种情况
流转换为http地址,提供给前端flv.js一类插件调用使用,其内部采用了nginx-rtmp-module实现。...官方对比如下: 功能 nginx-http-flv-module nginx-rtmp-module 备注 HTTP-FLV (播放) √ x 支持 HTTPS-FLV 和 chunked 回复 GOP...缓存 √ x 虚拟主机 √ x 省略 listen 配置 √ 见备注 配置中必须有一个 listen 纯音频支持 √ 见备注 wait_video 或 wait_key 开启后无法工作 reuseport...支持 √ x 定时打印访问记录 √ x JSON 风格的 stat √ x stat 中包含录制详情 √ x 支持的播放器 VLC (RTMP & HTTP-FLV) / OBS (RTMP...& HTTP-FLV) / JW Player (RTMP) / flv.js (HTTP-FLV).
我的笔记本装的是Debian 7.x,因为内核版本较低,所以macOS Sierra上支持的两个选项都不支持。...另外最近在尝试添加RTMP 302重定向转HTTP 302重定向的功能,由于很多播放器不支持RTMP 302重定向,但是支持HTTP 302重定向的功能基本上是标配,实测VLC是支持的。...下面是nginx的rtmp主要配置片段和VLC播放时的HTTP 302重定向截图:其中推流是在名为hls的application上推的(FFmpeg也不支持RTMP 302重定向,所以只能往hls推)。...不过这是个很重要的信息,浏览器对flv.js的播放支持是有数量限制的,Chrome和Firefox的限制数量都是6个,其他浏览器未测试。...现在对flv.js的支持已经稳定,下面是使用flv.js播放的截图: 一个商用厂商反馈视频源是纯视频时,不管使用什么播放器,播放连接没问题,但是一直接收不到视频数据,经调试发现是因为判断纯音频的逻辑有
那么我们就需要一层中间层,来将 RTSP 流转成前端可以支持的协议,这也引申出了目前实时流技术的几种方向: RTSP -> RTMP RTSP -> HLS RTSP -> RTMP -> HTTP-FLV...除此之外,它可以通过 HTTP 302 跳转灵活调度/负载均衡,支持使用 HTTPS 加密传输,也能够兼容支持 Android,iOS 等移动端。...在支持浏览器的协议里,延迟排序是这样的:RTMP = HTTP-FLV = WebSocket-FLV < HLS 而性能排序是这样的:RTMP > HTTP-FLV = WebSocket-FLV >...的命令 前端 import flv.js,然后使用它来播放 // 前端使用 flv.js,开启实时模式,然后访问这个 nginx 地址下的路径即可 import flvJs from 'flv.js'...直播中间分发到 CDN 节点 播放(阿里云支持 RTMP、FLV 及 HLS 三种播流协议)
我们知道多数监控摄像头都是支持RTMP协议的,当然公安部的摄像头是支持GB28181协议的,这个我们在本文不做过多赘述,我们来探讨一下网页播放RTMP视频流的播放器。 ? ?...网页可以播放RTMP视频流吗?当然是可以的,但是对于PC端来说,网页播放RTMP流媒体视频流将会承受更多的服务器压力,满足网页播放RTMP视频流有哪些要求,下文我们一起来看一下。 1.便捷。...跨平台支持PC端、安卓端、iOS端等主流终端; 3.易用。无须安装任何自有插件、监控APP等,减少资源消耗; 4.无限制。对接自有流媒体服务器平台,不限制观看人数。...我们研发的流媒体服务器自身支持对成功接入的摄像机实时视频进行7*24h录像,支持录像的检索与回放,并且支持网络硬盘录像机NVR按设备、通道、日期获取对应录像文件进行录像的检索与回放,无需安装各个安防厂商的视频播放插件...本文已经为大家介绍完毕啦,结论就是网页是能够播放RTMP视频流的,如果想体验网页播放RTMP视频流的流媒体服务器或者播放器,可以继续关注本栏目。
RTSP 那样复杂, RTMP 推的流只需要在浏览器安装插件就可以播放视频流,这里使用flv.js,这是b站的开源播放器,GitHub有1W多star。...2、浏览器使用 HTTPFLV 协议从 Nginx 拉流(安装flv.js)。...手把手教你用 buildroot 构建根文件系统 Nginux本身不支持RTMP,需要第3方模块。...nginx-rtmp-module:实现了RTMP协议 nginx-http-flv-module:在nginx-rtmp-module的基础上,实现了HTTPFLV,并覆盖nginx-rtmp-module...note:使用 vlc 播放器点播 mp4 文件或者直播获取摄像头视频流都可以,使用浏览器的话,flv.js 现阶段支持的较少,手机端浏览器基本不支持,电脑端浏览器看情况支持,未能做到很好的兼容,请注意
我们团队研发的大多流媒体服务器可输出RTMP、RTSP、HLS、FLV直播流,几乎可以适配市面上所有的播放终端,实现网页H5无插件直播。...最近有客户在进行测试RTMP推流服务器时,发现虚拟直播推流后,输出的直播流RTMP、HLS可以正常播放,FLV无法播放。...经过协调产品对应研发测试发现,是EasyPlayer.js内部报错导致,需要从EasyPlayer.js端开始排查,追踪到底层发现为第三方库flv.js导致,此类问题早前测试的时候也出现过,一直没有解决...也就是推过来的流是没问题的,那就是Chrome与flv.js之间存在问题。 我们推荐用户使用IE内核的浏览器来解决此问题,360也是可以的。...然后从研发层面需要解决的就是播放器 EasyPlayer 使用的第三方库 flv.js 和 chrome 之间的兼容性问题。 IE浏览器播放正常画面: ?
现有方案比较 RTMP协议 基于TCP adobe垄断,国内支持度高 浏览器端依赖Flash进行播放 2~5秒的延迟 RTP协议 Real-time Transport Protocol,IETF于1996...直接支持(video),适合APP直播,PC断只有Safari、Edge支持 必须是H264+AAC编码 因为传输的是切割后的音视频片段,导致内容延时较大 flv.js Bilibli开源,解析flv...WebRTC协议 1、Google力推,已成为W3C标准 2、现代浏览器支持趋势,X5也支持(微信、QQ) 3、基于UDP,低延迟,弱网抗性强,比flv.js更有优势 方案 CPU占用 帧率 码率...延时 首帧 flv.js 0.4 30 700kbit/s 1.5s 2s WebRTC 1.9 30 700kbit/s 0.7s 1.5s 4、支持Web上行能力 5、编码为H264+OPUS...小程序+直播 技术方案 基于RTMP,官方说底层使用HTTP/2的一种内部传输机制,但又说是基于UDP的,这就搞不懂了。。。
另一种方案是基于JS、WASM等前端技术,在前端直接拉流、解码、显示,比如flv.js等前端播放技术,有不少开源的方式,可以实现一些特殊格式、特殊协议的直接前端解码处理。...这种将RTSP/RTMP/FLV等直播协议、摄像头数据,转为WebRTC方式,有以下优势:1、良好的兼容性:目前主流的浏览器均支持WebRTC,因此该方案无需担心浏览器兼容性问题,用户可以选择自己习惯的浏览器使用...虽然也有一部分技术通过WebSocket方式获取视频,但往往这种拿到视频数据后,还需要基于类似FLV.js等技术,对视频数据要进行复杂的处理,才能进行显示,便捷性不如WebRTC。...具体架构图如下:以上系统平台具体功能有:1、支持多协议、多设备接入:支持RTMP/RTSP/Onvif/GB/T28181/等协议,多厂商品牌的设备接入 2、标准化输出,多终端全平台覆盖: 输出标准的WebRTC...,支持几乎全部主流终端浏览器打开播放 3、提供二次开发、定制等服务;
下面我整理了自己实现的方案以及网上看到的一些方案 一、FFmpeg + nginx 将转 hls 通过 video.js 在支持h5浏览器播放(我实现的) 参见:Nginx+FFmpeg实现rtsp流转...hls流,在WEB通过H5 video实现视频播放 不足:hls延迟较rtmp、http-flv大 二、FFmpeg + nginx-rtmp-module + h5 video,rtsp转rtmp播放...gui66497/article/details/78590190 https://blog.csdn.net/LLittleF/article/details/81111713 注:通过video.js播放rtmp...需要将代码放到服务器,本地windows电脑无法播放 不足:需要浏览器开启flash 三、FFmpeg + nginx-http-flv-module + flv.js,rtsp转rtmp,直接播放flv...格式 基于nginx-rtmp-module,通过配置将rtmp转为flv,最后通过flv.js播放。
通过 WebSocket 实时流播放 兼容 Chrome, FireFox, Safari 10, IE11 和 Edge 十分低开销,并且通过你的浏览器进行硬件加速 FLV HTTP FLV则是将RTMP...rtmp和http-flv的视频格式都是flv格式的,只是传输协议而不同。rtmp是tcp的传输协议,而http-flv是http长链接的传输协议。 总结 flvjs是一个H5播放器。...协议 http-flv rtmp hls 传输方式 http流 tcp流 http流 视频封装格式 flv flv Ts文件 延迟 低 低 高 数据分段 连续流 连续流 切片文件 h5播放 flv.js...1.使用npm安装flv.js npm install --save flv.js 2.新建FlvLive.vue文件,在文件中引入 import flvjs from 'flv.js' 3.在template...flvPlayer.play(); this.flvPlayer = flvPlayer; } }); flvjs.isSupported()判断当前浏览器是否支持
rtmp RTMP协议是Real Time Message Protocol(实时信息传输协议)的缩写,是Adobe公司的私有流媒体传输协议,一般传输的音视频格式是flv、f4v web上通过flash...播放器播放,pc端支持基本大多数浏览器都支持,但是移动端几乎都不支持,不过flash由于安全和性能问题将会逐渐被淘汰,并且主流浏览器默认都禁用flash播放器。...实现了通过h5播放flv视频的库 该协议同样可以做到秒级延迟 和rtmp协议不相上下,并且使用http请求获取数据,减少了握手损失(应用层协议握手) 同样http传输层协议是tcp,和rtmp一样都会遇到网络状况不好引起重传导致卡顿...关于flv.js flv.js是B站的开源项目。它解析flv文件后给原生HTML5 Video标签播放音视频数据,使得浏览器在不使用Flash的情况下播放FLV文件。...优点:性能较好,支持大多数主流浏览器(ios目前不支持),延迟低。
现有方案比较 RTMP协议 基于TCP adobe垄断,国内支持度高 浏览器端依赖Flash进行播放 2~5秒的延迟 RTP协议 Real-time Transport Protocol,IETF于1996...2~5秒的延迟,首帧比RTMP更快 WebRTC协议 ?...3、基于UDP,低延迟,弱网抗性强,比flv.js更有优势 方案 CPU占用 帧率 码率 延时 首帧 flv.js 0.4 30 700kbit/s 1.5s 2s WebRTC 1.9 30 700kbit...前端核心代码还是相当简洁的: live-pusher组件:设置好url推流地址(仅支持 flv, rtmp 格式)等参数即可,使用bindstatechange获取播放状态变化 <view id='video-box...参考文章 HTTP 协议入门 使用<em>flv.js</em>做直播 面向未来的直播技术-WebRTC【视频、PPT】 小程序音视频能力技术负责人解读“小程序直播” 小程序开发简易教程 小程序音视频解读
有些人呐,真是不见棺材不落泪,N(>=3)年前Adobe官宣了2020年底就不支持Flash了,最近发现非常多的朋友,到了真正完全不能用时,才考虑如何逃生,在群里一顿狂问“没有Flash了怎么播放RTMP...其实很多播放器底层都是用的MSE,比如flv.js播放HTTP-FLV或者WebSocket-FLV,比如hls.js播放HLS,比如dash.js播放DASH切片。...答案是:RTMP、HTTP-FLV和HLS一起用。 最好的替代场景是这样的: PC浏览器,延迟有要求的用HTTP-FLV,延迟没要求的用HLS。 移动端浏览器,用HLS,兼容性比较好,几乎都支持。...目前直播的云服务,这三个协议都是支持的,如果不能支持,自己用SRS搭建直播源站,转协议后分发,就可以支持了。 而且SRS还能将RTMP转成WebRTC,是居家必备的不二之选。 用什么播放器?...这个问题就比较简单了,根据协议可以选择播放器: HTTP-FLV,PC上用flv.js,移动端用Fijkplayer。
领取专属 10元无门槛券
手把手带您无忧上云