▲扫描图中二维码领会音视频手艺大会更多信息▲翻译：Alex
手艺审校：章琦
本文来自OTTVerse，做者为Krishna Rao Vijayanagar。Easy-Tech#033#
当视频流媒体席卷通信世界，为了连结和提拔用户增长，内容缔造者和流媒体办事供给者需要供给高量量的用户体验。而想要实现那一点，他们都需要在本身的网站上内嵌HTML5视频播放器。
在本文中，我们未来领会一下如今市道上可用的HTML5视频播放器（包罗开源和贸易播放器）。
HTML5视频播放器常用于在Chrome、Edge、Firefox、Safari等阅读器和其他撑持HTML5视频播放的平台（如三星和LG电视）上播放视频。它们能够被设置装备摆设为单码率视频流（通俗mp4文件）、HLS、MPEG-DASH、HDS等。除此之外，各公司也能够为HTML5视频播放器设置装备摆设DRM（Widevine、PlayReady或FairPlay）、利用CSAI或SSAI手艺的告白插入、字幕、数据阐发等功用。
接下来，我会介绍13种流行的HTML5视频播放器（请留意，排名不分先后）。
当务之急，让我们起头吧！
1、VideoJS
VideoJS是市道上更流行的免费、开源HTML5视频播放器。2010年，它从零起头开发，并已成为市场中多个开源和贸易播放器的根底。
播放形式上，VideoJS可用于曲播和点播，同时撑持HLS、DASH、WebM和MP4边下载边播放。在外不雅款式上，VideoJS可高度自定义，开源社区中有十分多的皮肤能够选用。Multi-DRM、告白插入、字幕等大大都重要的功用都能够通过插件设置装备摆设到播放器中。愈加完好的VideoJS功用和特征，请拜见：https://docs.videojs.com/。
Linkedin、The Guardian、Tumblr等多个大流量的组织和公司都利用VideoJS播放器，那也证了然它不只不变，并且正在被持续改良，同时还包管了充实的测试。
2、Shaka Player
Shaka Player是一款十分流行的免费、开源HTML5视频播放器。无需任何插件或Flash,它就能够撑持HLS和DASH等自适应码率流媒体协议。Shaka通过MSE和EME等开放Web尺度播放视频。它撑持点播、曲播、多时段内容、Multi-DRM、和字幕等功用。你能够在那里查看它的所有功用：https://github.com/google/shaka-player#dash-features
做为一款开源播放器，它能够为你供给多种选项：包罗查看源代码、停止你需要的修改和扩展。但是另一方面，若是在利用播放器时碰到困难，你必需依靠开源社区的帮忙。
3、Clappr
Clappr是一款开源、可扩展的免费HTML5视频播放器，用于在HTML5中播放视频内容。媒体巨头http://Globo.com撑持了它的开发。那款开源播放器能够轻松地集成到你的项目中，并根据你的需求停止扩展。Clappr利用的是基于插件的架构，那种架构允许你为所需要的各类功用编写插件，并且无需深切研究和弄乱核心代码。
Clappr默认利用HTMLVideoElement[1]停止视频播放。除此之外，它同样撑持DASH、HLS、边下载边播放和告白插入、动态Overlay、画中画等功用。
关于如许一款开源、社区撑持的播放器，你能够利用大量第三方插件，或者编写你本身的插件，然后提交给Clappr。
4、dash.js
dash.js播放器是更佳MPEG-DASH播放器之一，其声明的目的是：“dash.js是DASH行业论坛倡议的，目标是利用W3C所定义的媒体源扩展API来实现产物级品量的框架，该框架用于创建播放MPEG-DASH内容的视频和音频播放器。” dash.js适用于各类编码格局，撑持带内事务、多时段，而且撑持跨阅读器的DRM且商用免费。你能够看到良多公司将dash.js做为独立播放器利用，或者做为插件（好比videojs-contrib-dash[2]）内置于VideoJS中利用。
关于那款开源播放器，你能够免费利用源代码，而且根据本身的需乞降要求修改dash.js播放器。别的，颠末MPEG-DASH社区中一些重要架构师的不竭开发，你所利用的必然是最新、最棒的MPEG-DASH标准。
想要测试dash.js播放器，你能够拜候：http://reference.dashif.org/dash.js/nightly/samples/dash-if-reference-player/index.html
5、hls.js
hls.js是另一款流行的视频播放器，用于播放HLS（m3u8）视频流。它免费、开源且由手艺社区的开发者维护。它的网站声明是：“HLS.js是一个实现了HTTP视频流客户端的JavaScript库。它依赖HTML5视频和媒体源扩展停止播放。”你能够经常看到人们将hls.js做为独立播放器利用，或者通过插件和VideoJS一路利用（好比videojs-hlsjs[3]）。
hls.js具备丰硕的功用，包罗对曲播和点播、fMP4 (CMAF)、DRM（AES-128和SAMPLE-AES）、字幕、隐藏字幕等的撑持。你能够在那里查看它的所有功用：https://github.com/video-dev/hls.js/#features
想要拜候播放器的托管demo，请点击：https://hls-js.netlify.app/demo/
6、JWPlayer
关于视频流媒体公司而言，JWPlayer是一套流行的端到端视频处理计划。你能够上传视频到JWPlayer，它将停止压缩、打包并将视频传输给播放器，同时供给监测。JWPlayer能够跨网站、挪动应用或者连网电视平台利用，做为可靠视频播放器，它是一个不错的选择。
在功用方面，JWPlayer撑持HLS和DASH视频流、360度全景视频和VR、告白插入（CSAI和SSAI）、Multi-DRM、字幕以及他们本身的不雅寡互动和数据阐发办事。视频一经发布，JWPlayer的不雅寡互动产物就能够主动插入来自你的内容库中的相关视频，关于大规模的媒体公司而言，那是一个冲动人心的处理计划。JWPlayer还供给挪动SDK（Android和iOS），那使它成为多平台流媒体办事供给商的流行选择。
你在那里能够查看JWPlayer的全数功用：https://www.jwplayer.com/html5-video-player/
7、Bitmovin
Bitmovin是一家顶级视频流媒体手艺供给商，它开发了视频播放器、阐发和云编码等办事。Bitmovin的手艺遭到了DAZN、BBC、Discovery、Telecine、RTL、iflix等大公司的相信。若是你选择利用Bitmovin播放器，那么你就参加了那些大公司的行列。
Bitmovin HTML5播放器撑持大部门现代流媒体协议，好比HLS、DASH和Smooth
Streaming。它同样撑持多种编解码器、字幕、隐藏字幕、DRM、告白插入（CSAI和SSAI）。你能够在那里领会它的更多功用：https://bitmovin.com/docs/player利用Bitmovin的一个优势在于，视频播放器是为他们本身的阐发办事设置的，能够无缝集成。除此之外，Bitmovin为播放器供给了包罗Android、iOS、tvOS、Roku、Chromecast、Amazone Fire TV、三星和LG智能电视以及其他平台在内的庞大生态系统，那使它成为多平台流媒体办事的良选。
8、THEOplayer
THEOplayer是另一家流行的视频播放器软件公司，在视频播放手艺方面，它曾获得多个奖项。该公司拥有十分优良的视频播放器（撑持HLS、DASH和MSS等），适用于Web（HTML）、Android、iOS等其他流媒体平台。除此之外，CNN、RAI、VRT、Telia、BT Sport等都是他们的大客户，关于THEOplayer品牌来说，那可是个好兆头。
THEOplayer的HTML5视频播放器撑持HLS、DASH、Smooth Streaming以及HLS和DASH的低延迟变体协议。用户能够在Web、挪动Web、机顶盒和智能电视中利用THEOplayer播放器。那款播放器还拥有用于下载视频切片的自定义ABR算法，而且能够通过供给商（如NPAW、Conviva、MediaMelon、Mux
Data、Agama等）超卓地撑持Multi-DRM、告白插入（CSAI和SSAI）、字幕、阐发等功用。和其他视频供给商类似，THEOplayer是一个十分棒的播放器选择（鉴于其庞大的生态、对各类功用的有力撑持以及多平台可用性）。
9、NexPlayer
NexPlayer是一家视频播放手艺供给商，而且在视频流媒体与HLS和MPEG-DASH播放（在所有设备）上的经历超越15年。良多视频播放器厂商凡是会将本身的播放器基于开源播放器并对其停止大量修改，与那些厂商差别，NexPlayer从零起头开发了本身的播放器，编写了此中的全数代码。
NexPlayer全面撑持HLS、DASH、Smooth
Streaming、DRM、告白插入（CSAI和SSAI）、字幕等功用。固然没有本身的阐发办事，但是它与支流阐发办事供给商完全兼容。你能够在那里查看它的所有特征: https://nexplayersdk.com/10、castLabs
castLabs是一家视频处理计划公司，它供给视频播放软件、DRM和内容处置东西箱。良多公司能够利用它的PRESTOplay视频播放器东西箱创建内嵌在网站上的播放器。流媒体办事供给商也能够将它的播放器摆设在智能电视（如三星、LG）和游戏平台（如Xbox one）上。PRESTOplay构建于流行的Shaka播放器之上，而且为了商用停止了大量修改。
castLabs的PRESTOplay撑持HLS、DASH、MSS、边下载边播放视频、AirPlay、Chromecast、Multi-DRM、告白插入（CSAI和SSAI）。你能够到那里查看它的完好功用：
https://castlabs.com/prestoplay/web-apps/
固然castLabs没有本身的阐发平台，但它撑持与流行阐发办事供给商（如Conviva、Mux Data、NPAW和Agama等）的集成。
和其他视频播放器一样，castLabs的播放器可用于Android和iOS平台，关于多平台视频播放来说，它是一个不错的选择。
11、Flowplayer
Flowplayer是一款十分轻量级的、可扩展的视频播放器，它是为视频流媒体供给商筹办的Flowplayer全栈处理计划的一部门。它为你的视频办事供给编码、托管、播放和监测等一切功用。除此之外，它的系统被设置装备摆设为十分容易修改和设置款式（拜见上文截图图片），所以没有手艺布景的开创人和创做者都能轻松利用那款播放器。
Flowplayer撑持HLS、DASH和mp4播放。基于HTML5原生播放器，Flowplayer可撑持Chromecast、AirPlay、Android、iOS、告白插入、DRM和数据阐发等功用。你能够在那里查看它的所有功用：
https://flowplayer.com/features/html5-player
做为一款全栈处理计划，Flowplayer所供给的阐发功用很好地集成到了播放器中，那对流媒体供给商来说，是一个很有吸引力的选择。
12、Radiant Media Player
Radiant Media Player如许描述本身：“到处可见的现代HTML5视频播放器，可快速创建Web、挪动和OTT应用。”关于拥有普遍功用和特征的Radiant Media Player来说，那句描述实至名归。做为跨设备的HTML5视频和音频播放器，它可以显示HLS、DASH或progressive（边下载边播放）下载内容。
在功用方面（你能够在它的文档中查看：https://www.radiantmediaplayer.com/docs/latest/quick-start.html），Radiant Media Player撑持HLS、DASH和边下载边播放。它还撑持DRM（Widevine、Fairplay和PlayReady）、隐藏字幕、字幕和告白插入（CSAI和SSAI）。
Radiant Media Player的一个优势是：团队能够通过他们在Cordova和Ionic的播放器，利用一个代码库为挪动平台创建应用。固然它没有内置阐发办事，但是撑持与Google Analytics、MediaMelon、Mux Data和Matomo的集成。
13、VisualON
VisualOn是一家支流播放器SDK供给商，拥有专属的播放器手艺栈，可以在任何连网设备上撑持跨平台内容传输。
他们的播放器撑持HLS、Smooth Streaming、MPEG-DASH、边下载边播放, RTSP和MS-HTTP等最重要的流媒体协议。除此之外，还撑持多种视频和音频编解码器、Multi-DRM、告白插入（SSAI和CSAI）、字幕、AirPlay、Chromecast、低延迟传输等。你能够在那里领会它的更多功用：https://www.visualon.com/index.php/onstream-analytics/
VisualON的优势在于，它能够将本身的流媒体监测办事（或者阐发办事）慎密集成到播放器上。第二个优势是：它是一个撑持多平台的播放器厂商，同时撑持Android、iOS和tvOS。
结语我希望以上列出的流行HTML5视频播放器可以对你有所帮忙。当然，在性能、订价、撑持、可用性和生态等方面，每款播放器都有本身的长处和缺点。你能够按照本身的需乞降预算，在充实研究那些播放器后，再停止选择。
若是你还晓得其他HTML5视频播放器，欢送鄙人方评论。
我们下次再见，珍重！Happy Streaming！
正文：
[1] https://developer.mozilla.org/en-US/docs/Web/API/HTMLVideoElement
[2] https://github.com/videojs/videojs-contrib-dash
[3] https://github.com/streamroot/videojs-hlsjs-plugin
References:
https://videojs.com/
https://github.com/shaka-project/shaka-player
https://github.com/clappr/clappr
https://github.com/Dash-Industry-Forum/dash.js?
https://github.com/video-dev/hls.js/
https://www.jwplayer.com/html5-video-player/
https://bitmovin.com/
https://www.theoplayer.com/
https://nexplayersdk.com/
https://flowplayer.com/
https://castlabs.com/
https://www.radiantmediaplayer.com/
https://www.visualon.com/
称谢：
本文已获得做者Krishna Rao Vijayanagar受权翻译和发布，特此感激。
原文链接：
https://ottverse.com/best-html5-video-players-for-the-web-free-and-paid/