实现WEB播放H265HEVC视频方案，浏览器网页视频直播点播播放器liveweb

梦里梦外; 2023-10-14 05:57 87阅读 0赞

H.265/HEVC是当前⾮常⽕的视频压缩⽅式，相对于⼤家熟知的H.264 ，平均可以带来接近于50%的宽度节省。这对于我们做视频的开发者⽽⾔，⽆疑可以在同等流量下拿到更多的Buffer，⽆论是直播还是视频播放都是⾮常有收益的事情。

在HEVC[编码][Link 1][架构][Link 2]中，整体被分为了三个基本[单位][Link 3]，分别是编码单位（coding unit, CU）、预测单位（predict unit, PU）和转换单位（transform unit, TU）。

H.265/HEVC的编码架构⼤致上和H.264/AVC的架构相似，主要也包含帧内预测（intra prediction）、帧间预测（inter prediction）、转换（transform）、量化（quantization）、去区块滤波器（deblocking filter）、熵编码（entropy coding）等模块。

但是⽐起H.264/AVC，H.265/HEVC提供了更多不同的⼯具来降低码率。“更多的预测算法，更⼤的编码单位”形象的概括了H.265架构。以编码单位来说，H.264中每个宏块（macroblock/MB）⼤⼩都是固定的16x16像素，⽽H.265的编码单位可以选择从最⼩的8x8到最⼤的64x64。

H.265/HEVC编码架构：

H.264/AVC编码架构：

同时，H.265的帧内预测模式⽀持33种⽅向（H.264只⽀持8种），并且提供了更好的运动补偿处理和⽮量预测⽅法。反复的质量⽐较测试已经表明，在相同的图象质量下，相⽐于H.264，通过H.265编码的视频⼤⼩将减少⼤约39-44%。由于质量控制的测定⽅法不同，这个数据也会有相应的变化。

近⼀两年来，越来越多的监控⼚家新出⼚的设备，默认采⽤H265视频编码了。当我们要部署这类视频应⽤时，客户端解码是个⼤问题。然⽽，安防领域的⽹络摄像机(IPC)的WEB视频直播都依赖于浏览器插件，对于部署在web平台的流媒体播放器则⼜是⼀个亟待解决的难题。

要实现通⽤的跨平台，跨浏览器⽀持的解码器⽅案，wasm成为⽬前唯⼀的可能。Wasm的⽬标就是充分发挥硬件能⼒，使⼀些耗cpu的操作可以从原⽣的js中剥离出来独⽴运⾏。liveweb流媒体播放器就⽀持这种⽅式，实现整个架构，我们采⽤Fetch从服务器上拉流，ffmpeg进⾏软解码，webgl进⾏显⽰。

liveweb是⼀款集播放http-flv，rtmp，hls，websocket于⼀⾝的H5视频直播/视频点播播放器，使⽤简单，功能强⼤，能够播放http-flv/Websocket-flv协议的直播流。⽀持解码H.264视频(Baseline, Main, High Profile全⽀持，⽀持解码B帧视频)，同时也⽀持解码H.265视频（flv id == 12），能够在 PC\\Android\\iOS 浏览器Webview内实现200毫秒以内低延迟直播播放。

随着浏览器的不断更新，技术更加成熟，liveweb现在也提供云平台版本，在性能⽅⾯会有大幅度的提升，⽬前已可以测试使⽤。![2563f64d57634d509c43a6a9c78967e3.webp][]

![95363105448b46cda4f8914bbbc6fd31.webp][]

Liveweb是好游科技自主开发的网页播放器，支持 RTSP、RTMP、HTTP、HLS、UDP、RTP、File 等多种流媒体协议播放，同时也有多种显示方式 (GDI,D3D) 及格式 (RGB24,YV12,YUY2,RGB565)，经过 7x24 小时连续拷机测试，能够很好的处理断连.

iveweb是可支持H.264/H.265视频播放的流媒体播放器，性能稳定、播放流畅，可支持的视频流格式有RTSP、RTMP、HLS、FLV、WebRTC等，具备较高的可用性。liveweb还拥有Windows、Android、iOS版本，其灵活的视频能力，极大满足了用户的多样化场景需求。

liveweb具备较强的灵活性，在视频直播过程中liveweb可通过H5进行视频解码，只要客户端支持H5，就能完美进行视频的无插件直播，同时还支持大码率视频直播，并可支持H.264、H.265两种编码格式。如果大家正在找寻一款供能强大的流媒体播放器，那么liveweb将会是一个不错的选择，我们也欢迎大家的了解和试用

[Link 1]: https://www.17tex.com/tex/1/87991.html
[Link 2]: https://www.17tex.com/tex/3/4699.html
[Link 3]: https://www.17tex.com/tex/4/1096.html
[2563f64d57634d509c43a6a9c78967e3.webp]: https://img-blog.csdnimg.cn/2563f64d57634d509c43a6a9c78967e3.webp
[95363105448b46cda4f8914bbbc6fd31.webp]: https://img-blog.csdnimg.cn/95363105448b46cda4f8914bbbc6fd31.webp