视频流处理-在线播放

视频格式

常见的视频格式有WEBM、AVI、MPEG,但是对于有些需要实时监控的场景项目,我们可能需要用到rtsp协议的视频流,例如大华、海康威视的项目,以及可能遇到的rtmp直播实时视频流。

HTML中的video标签能够允许我们在浏览器中播放视频,对于视频的格式也是有限制的,仅支持OGG、MPEG4、WebM,不同的浏览器支持程度和兼容性也不一样。

视频格式 IE Firefox Chrome Opera Safari
OGG × 3.5+ 5.0+ 10.5+ ×
MPEG4 9.0+ × 5.0+ × 3.0+
WEBM × 4.0+ 6.0+ 10.6+ ×

然而即使是你使用的视频格式符合要求,浏览器也并不能进行直接播放,因为浏览器支持的编码格式也是有限制的,我们所说的视频格式只是一个文件格式,视频流的编码格式就类似我们使用的语言,语言不同即使输出的是一样格式的视频也并不能被浏览器所支持。

video标签所支持的视频格式和编码:

  • MP4格式

    MPEG 4文件使用 H264 视频编解码器和AAC音频编解码器
  • WebM格式

    WebM 文件使用 VP8 视频编解码器和 Vorbis 音频编解码器
  • Ogg格式

    Ogg 文件使用 Theora 视频编解码器和 Vorbis音频编解码器

只有h264编码的MP4视频(MPEG-LA公司)、VP8编码的webm格式的视频(Google公司)和Theora编码的ogg格式的视频(iTouch开发)可以使用html5的<video>标签直接进行播放。


视频流

视频流四字编码格式有很多,具体对照表可以参考

[https://blog.csdn.net/xunan003/article/details/92794237]

本地播放转码处理

对于无法使用HTML5的video标签进行直接播放的视频文件,可以通过在本地使用VLC 亦或者是格式工厂进行转码操作,具体工具的使用就不多说了,本文主要是讲如何通过RTSP、RTMP协议来传输视频流达到画面实时展示的。

在线网页播放转码处理

首先介绍一下RTSP、RTMP协议,他们都是流媒体协议,都可以用来做直播或者是有实时画面需要的应用场景。

理论上使用HTTP-FLV协议也能进行直播,但是一般都是用来作为点播功能。

  • RTMP一般传输的是FLV、F4V格式的视频流
  • RTSP一般传输的是TS 、MP4格式的视频流
    | 协议 | 格式 | 延迟 | 离线监测 | 端口占用 | 依赖库 |
    | — | — | — | — | — | — |
    | HLS | OGG | 高,10s+ | 难 | n | VLC视频转码+video.js |
    | RTMP | FLV | 较低,5s | 难 | n | ffmpeg+nginx+flash+video.js |
    | WebSocket | MPEGTS | 很低,渲染慢 | 易 | 1 | ffmpeg+express+jsmpeg.js |
    | HTTP-FLV | FLV | 很低,渲染快 | 易 | 1 | ffmpeg+express+flv.js |

由此可见我们可以采用三四两种结合的方式实现直播或者摄像头内容展示。

实现:

使用express+expressWs实现一个后台服务器和ws服务器

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值