H265和H264都是视频编码规范,H265是新一代视频编码规范,与H264相比压缩比更高,同样的码率下视频质量更高,或者说同样质量的视频占用的带宽和存储更少。之前由于终端支持有限,h265的推广使用一直较为缓慢,最近随着越来越多的设备终端开始支持H265,H265的使用范围在迅速扩大。 本文介绍几款开源的H265网页播放器,经过笔者考察对比,这几款播放器的知名度都相对较高,开源,且经过不少人项目验证使用。
1、最简单好用的H265网页播放器mpegts.js
简介 mpegts.js 是在 HTML5 上直接播放MPEG-TS/FLV流的播放器,针对低延迟直播优化。mpegts.js 通过在 JavaScript 中渐进化解析 MPEG2-TS 流并实时转封装为 ISO BMFF (Fragmented MP4),然后通过 Media Source Extensions 接口把音视频数据共给 HTML5 <video> 元素。
特征:
- 支持H264和H265视频格式
- 列表支持FLV封装的H.264/H.265 + AAC / MP3媒体内容
- 支持HTTP-FLV,WebSocket-FLV协议
- 兼容Chrome, FireFox, Safari 10, IE11 和Edge
- 支持浏览器硬加速
代码地址 https://github.com/xqq/mpegts.js
局限 由于实现原理是通过js对各种h265封装进行解封装,最后封装成统一的mp4格式供给video标签,本身并不做解码(这也许是正确的),所以播放能力最终以来播放终端的软硬件环境,如果设备或浏览器本身不支持h265就无法正常播放,比如Win7系统和较早的手机通常都无法播放h265视频。
2、最硬核的H265网页播放器h265web.js
据说是能找到的支持的能力最多的HEVC/H.265网页播放器。一个可支持HEVC/H.265编码播放360P、480P、540P、720P、1080P的HEVC播放器。 区别于上一个播放器,h265web.js是在一些本身就不支持H.265的浏览器上给H.265播放一个解决方案。 这个款播放器采用的是MSE(Media Source Extensions)和WASM(WebAssembly)技术,即将H265视频解码器作为Web应用的一部分同时发布,确保在不支持H265的设备环境中能够进行H265解码播放。 特征 支持如下封装:
- mp4
- mov
- mkv
- av1
- mpeg-ts
- mpeg-ps
- m3u8
- hls
- flv
- http-flv
- http-ts
- http-hevc
- http-hevc
- websocket-hevc
- websocket-flv
- websocket-ts
- HEVC/H.265
- HEVC/H.265
- AVC/H.264
- AVC/H.264 支持的视音频格式:
- AVC/H.264
- HEVC/H.265
- AAC
- G711A
- G711U
代码地址 https://github.com/numberwolf/h265web.js
局限 1)由于使用WASM技术,解码器需要通过Web服务器发布,因此无法做本地调试,需要配置一个Web服务环境。 2)在不支持H265的硬件环境中采用软解码,对系统性能要求较高,在大多数设备上要求视频帧率低于20fps,码率低于1.5Mbps. 3)产品化程度一般
WasmVideoPlayer
作者说这是一款使用WASM、FFmpeg、WebGL、Web Audio等组件实现了一个简易的支持H265的Web播放器,作为探索、验证,just for fun。 特征 文档不错,可以作为WASM、MSE学习的参考项目。 依赖 WASM和MSE,WASM使用ffmpeg代码,前面已经说过,不再赘述。主要使用FFmpeg来做解封装(demux)和解码(decoder),由于使用了FFmpeg(3.3),理论上可以播放绝大多数格式的视频,这里只针对H265编码、MP4封装,在编译时可以只按需编译最少的模块,从而得到比较小的库。 代码下载 https://github.com/flowplayer/flowplayer