、Android 熱修復框架 Tinker★Star 8967

Tinker是Android的熱修復解決方案庫，它支持dex，庫和資源更新，無需重新安裝apk。有一些問題，Tinker不能動態更新：

無法更新AndroidManifest.xml，例如添加Android組件。；不支持一些三星型號與os版本的android-21；由于GooglePlay開發者分發協議，我們無法動態更新我們的apk（詳情：

https://github.com/Tencent/tinker）

2、微信客戶端跨平臺組件Mars★Star 8874

Mars是微信官方的終端基礎組件，目前已接入微信 Android、iOS、Mac、Windows、WP 等客戶端。主要包括以下幾個部分：

●comm：可以獨立使用的公共庫，包括socket，線程，消息隊列，協程等;

●Xlog軟件：日志組件，可靠性高，高性能

●SDT：網絡診斷組件

●STN：信令分發網絡模塊，也是Mars最主要的部分。圖。（詳情：https://github.com/Tencent/mars）

3、微信移動數據庫框架 WCDB(WeChatDatabase) ★Star3123

WCDB(WeChatDatabase)是一個高效、完整、易用的移動數據庫框架，基于SQLCipher，支持iOS, macOS和Android，WCDB于6月9日正式對外開源。

開源地址：https://github.com/Tencent/wcdb

WCDB for iOS/macOS 基本功能

·WINQ(WCDB語言集成查詢): 通過WINQ，開發者無須為了拼接SQL的字符串而寫一大坨膠水代碼。

·ORM(Object Relational Mapping):WCDB支持靈活、易用的ORM。開發者可以很便捷地定義表、索引、約束，并進行增刪改查操作。

·多線程高并發: WCDB支持多線程讀與讀、讀與寫并發執行，寫與寫串行執行。

·加密：WCDB提供基于SQLCipher的數據庫加密。

·損壞修復: WCDB內建了Repair Kit用于修復損壞的數據庫。

·反注入: WCDB內建了對SQL注入的保護。

WCDB for Android 基本功能

·基于SQLCipher的數據庫加密

·使用連接池實現并發讀寫

·內建 Repair Kit 可用于修復損壞數據庫

·針對占用空間大小優化的數據庫備份/恢復功能

·日志輸出重定向以及性能跟蹤接口

·內建用于全文搜索的mmicu FTS3/4 分詞器

4、手機前端開發調試工具vConsole★Star 2393

vConsole是一款由微信公眾平臺前端團隊打造的前端調試面板，專治手機端看 log 難題。 目前 vConsole 自帶有 2 個面板，默認為“日志”面板，負責展示 log。第二個是“系統”面板，vConsole會自動將一些基礎信息（如系統版本）打印出來，方便開發者定位問題。若頁面是在微信內置瀏覽器中打開的，vConsole還會打印出微信版本號、當前網絡類型等額外信息。（詳情：https://github.com/WechatFE/vConsole）

5、微信團隊前端開發工具WeFlow ★Star 2233

這是一個高效、強大、跨平臺（macOS & Win）的前端工具，核心基于 tmt-workflow 工作流.（詳情：

https://github.com/weixin/WeFlow）

6、分布式后臺服務引擎MSEC★Star 2221

毫秒服務引擎（MSEC）由騰訊 QQ 團隊開源。它是一個后端 DEV＆OPS 引擎，包括RPC，名稱查找，負載平衡，監控，發布和容量管理。毫秒服務引擎特性：

● 模塊間訪問采用RPC的方式，開發者不用關注網絡與報文格式，像寫單機程序一樣開發分布式服務。

● 負載自動均衡與容錯，對于單機故障、局部網絡波動等狀況自動應對，服務高可用性。

● 支持 C/C++/java/PHP 語言，如果選擇 C/C++ 語言，支持協程，兼具開發和運行效率。

●Web 化的管理界面

● 簡易部署，需要復雜部署的服務器都采用docker鏡像的方式安裝

● 相比使用其他開源組件拼湊起來的解決方案，毫秒服務引擎更加的體系化，對團隊的規范更加到位（詳情：http://haomiao.qq.com/）

7、隨身調測平臺GT★Star 2183

GT（隨身調）是 APP 的隨身調測平臺，它是直接運行在手機上的“集成調測環境”(IDTE, Integrated Debug Environment)。利用 GT，僅憑一部手機，無需連接電腦，您即可對APP進行快速的性能測試(CPU、內存、流量、電量、幀率/流暢度等等)、 開發日志的查看、Crash日志查看、網絡數據包的抓取、APP 內部參數的調試、真機代碼耗時統計等。如果您覺得GT提供的功能還不夠滿足您的需要，您還可以利用 GT 提供的基礎 API 自行開發有特殊功能的 GT 插件，幫助您解決更加復雜的 APP 調試問題。（詳情：

https://github.com/Tencent/GT）

8、Unity3D 下 Lua 編程解決方案 xLua★Star 1816

xLua為Unity3D增加Lua腳本編程的能力，xLua在功能、性能、易用性都有不少突破，這幾方面分別最具代表性的是：

① 可以運行時把C#實現（方法，操作符，屬性，事件等等）替換成lua實現；

② 出色的GC優化，自定義struct，枚舉在Lua和C#間傳遞無C# gc alloc；

③ 編輯器下無需生成代碼，開發更輕量；

（詳情：https://github.com/Tencent/xLua）

9、RPC開發框架Tars★Star 1800

它是基于名字服務使用 Tars 協議的高性能 RPC 開發框架，配套一體化的運營管理平臺。Tars 是騰訊從 2008 年到今天一直在使用的后臺邏輯層的統一應用框架 TAF（Total Application Framework），目前支持 C ++ 和 Java 兩種語言。目前該框架在騰訊內部，各大核心業務都在使用，頗受歡迎，基于該框架部署運行的服務節點規模達到上萬個。（詳情：

https://github.com/Tencent/Tars）

10、MySQL集群PhxSQL★Star 1759

PhxSQL是一個基于Paxos和Percona的高可用性和強大的一體化MySQL集群，PhxSQL以單Master多Slave方式部署，在集群內超過一半機器存活的情況下，可自身實現自動Master切換，且保證數據一致性。（詳情：https://github.com/tencent-wechat/phxsql）

11、超輕量級 Web 手勢庫AlloyFinger★Star 1734

可以看到hammerjs體積遠遠大于AlloyFinger，對于手機QQ web加載速度性能追求極致的同學來說，使用hammerjs的大小是不可以接受的！那么，為什么hammerjs這么大？看下架構設計便知♂（詳情：https://github.com/AlloyTeam/AlloyFinger）架構設計：

12、多機狀態拷貝類庫PhxPaxos★Star 1244

PhxPaxos是騰訊公司微信后臺團隊自主研發的一套基于 Paxos 協議的多機狀態拷貝類庫。它以庫函數的方式嵌入到開發者的代碼當中，使得一些單機狀態服務可以擴展到多機器，從而獲得強一致性的多副本以及自動容災的特性。 這個類庫在微信服務里面經過一系列的工程驗證，并且我們對它進行過大量的惡劣環境下的測試，使其在一致性的保證上更為健壯。（詳情：

https://github.com/tencent-wechat/phxpaxos）

13、Web組件化框架Omi ★1057

Omi是一款開放現代的Web組件化框架，有以下特性：

① 局部CSS：HTML+ Scoped CSS + JS組成可復用的組件。不用擔心組件的CSS會污染組件外的,Omi會幫你處理好一切

② 超小的尺寸：7 kb (gzip)，雖然文件尺寸小，但是兼容性很好！

③ 更新更自由：每個組件都有update方法，可自由更新。

④ 模板引擎可替換，開發者可以重寫Omi.template方法來使用任意模板引擎

⑤ 完全面向對象

⑥ Omi提供了ES6+和ES5的兩種開發方案

（詳情：https://github.com/AlloyTeam/omi）

14、UI 前端框架 QMUI Web ★Star 888

QMUIWeb 是一個專注 Web UI 開發，幫助開發者快速實現特定的一整套設計的框架。通過 QMUI Web，開發者可以很輕松地提高 Web UI 開發的效率，同時保持了項目的高可維護性與穩健。如果你的項目需要有一套完整的設計，并且可能有頻繁的變動，那么 QMUI Web 框架將會是你最好的解決方案。（詳情：

https://github.com/QMUI/QMUI_Web）

15、curvejs★Star 749

是騰訊AlloyTeam打造的一款魔幻線條框架，讓線條成為一名優秀的舞者，讓線條們成為優秀的舞團，HTML5 Canvas就是舞臺。其原理就是使用 Perlin-Noise +Particle System + Bézier Curve + Color Transition 制作而成。使用curvejs實現類似變幻線功能只需要不到10行代碼。 https://github.com/AlloyTeam/curvejs

16、基于C ++的RPC框架 PhxRPC★Star 645

PhxRPC是微信后臺團隊推出的一個非常簡潔小巧的RPC框架，編譯生成的庫只有450K（詳情：

https://github.com/tencent-wechat/phxrpc）

17、Web 開發調試工具AlloyLever★533

AlloyLever是騰訊 AlloyTeam 團隊開源的一款 Web開發調試工具。AlloyLever的功能：點擊alloylever 按鈕之間切換顯示或隱藏工具面板； Console會輸出所有用戶打印的日志如 console.[log/error/info/debug/debug] ；Console會輸出所有的錯誤信息(腳本錯誤和網絡請求錯誤) ；XHR 面板會輸出所有（）AJAX 請求和服務器端返回的數據； Resouces 面板會輸出所有的 Cookie 信息和 LocalStorage ；TimeLime 面板會輸出頁面相關的生命周期里的時間段耗時情況（詳情：

https://github.com/AlloyTeam/AlloyLever）

18、bk-cmdb★Star 452

藍鯨配置平臺是一款面向應用的 CMDB，在 ITIL 體系里，CMDB是構建其它流程的基石，而在藍鯨智云體系里，配置平臺就扮演著基石的角色，為應用提供了各種運維場景的配置數據服務。現有功能如下：用戶管理、業務管理、拓撲（集群、模塊）管理、資源池管理、主機管理、日志查詢（詳情：

https://github.com/Tencent/bk-cmdb）

19、分布式開發框架Pebble-RPC★Star 351

Pebble是一個分布式開發框架。基于該框架，可以讓開發者只需專注于業務邏輯的實現，而不需要關注基礎功能的開發，如網絡通信，數據存儲，集群管理等。使用pebble配套的運營系統，可方便的進行游戲開區開服，版本升級，擴容縮容等操作。當前發布的Pebble版本，是一個Linux平臺C++版本的后臺開發框架。整個分布式開發框架包括：服務管理、集群管理、RPC通信、協程、廣播、進程框架。（詳情：https://github.com/TencentOpen/Pebble）

20、UI自動化測試框架GAutomator★Star 337

GAutomator是一 Unity 手游的UI 自動化測試框架。

WindowsOs 和軟件要求：Windows 7（32/64位），Windows 8或更高版本；python 2.7；Android SDK（或adb），在設備上啟用ADB設置，并使用usb與您的PC連接您的Android設備。Linux和軟件要求：Ubuntu 14.04 LTS；python 2.7；Android SDK（或adb），在設備上啟用ADB設置，并使用usb與您的PC連接您的Android設備。

Android：Android 4.3（API級別18）或更高版本。（詳情：https://github.com/Tencent/GAutomator）

21、WeDemo★Star 297

WeDemo為微信團隊開源項目，用于幫助微信開發者完成微信登錄、微信分享等功能的接入和開發。開發者可參考源代碼完成開發，也可以直接將代碼應用到自己的App開發中，安全、便捷地在App中實現微信分享、微信登錄功能。（詳情：https://github.com/Tencent/WeDemo）

22、AI開發框架組件 Behaviac★Star 297

Behaviac是游戲 AI 的開發框架組件，也是游戲原型的快速設計工具。支持行為樹BT，狀態機 FSM，HTN 等多種范式，方便的編輯和調試。支持全平臺，適用于客戶端和服務器，助力游戲快速迭代開發。編輯器可以運行在 PC 上，操作方便直觀可靠，支持實時和離線調試；編輯器可以導出 xml，bson 等多種格式，更可以導出 C++，C# 源碼，提供最高效率。 運行時支持全平臺，有 C++ 和 C# 兩個版本，原生支持Unity。 （詳情：

https://github.com/Tencent/behaviac）

23、Fanvas★Star 214

Fanvas是一個把swf轉為html5 canvas動畫的系統，由兩部分組成：Action實現的解析器、js運行庫。（詳情：https://github.com/Tencent/Fanvas）

24、HaboMalHunter★Star 161

HaboMalHunter是 Habo Malware 分析系統（https://habo.qq.com）的子項目，可用于Linux系統上的自動惡意軟件分析和安全評估。該工具可用于 Linux x86 /x64 平臺上 ELF 文件的靜態和動態分析。（詳情：

https://github.com/Tencent/HaboMalHunter）

25、基于ACE的服務框架 TEAF★157

TEAF(TencentEasy ACE Framework)，基于 ACE 的高性能服務框架，單進程多線程模型，支持 select/epoll 等多種網絡 IO 模型，同時支持 tcp 和 udp 協議，支持二進制(pb等)和文本格式(json等，易于理解)，相對多進程模型的框架來說更易維護，更輕量。業務側只需要開發自己的邏輯處理即可實現高性能的業務后臺服務器。已經在騰訊互娛(IEG)大部分平臺類產品中成熟應用，比如 idip，游戲人生，心悅，幫幫，新終端游戲中心 aj，cross 等，公司其他 BG 也有很多產品在使用。（詳情：

https://github.com/Tencent/Teaf）

26、QT4A★Star 67

QT4A（Android的快速測試）是適用于 Android 應用程序的 QTA 測試自動化驅動程序。支持Android 2.3 - 6.0 版本，需要設備根。支持多設備同時測試；支持跨進程，跨應用測試；支持進行過控件混淆的安裝包（需要映射文件）；支持自定義控件（如果有代碼混淆需要映射文件）（詳情：

https://github.com/Tencent/QT4A）

27、輔助測試工具WeTest-Assistant★Star 49

WeTest助手包括性能測試和遠程調試兩大功能。手游客戶端性能測試常用性能維度，CPU，內存，FPS，流量一次性全部收集， 圖表化展示，數據可按場景化分類，并且支持離線和在線兩種模式，地鐵上都可以做測試，Web上看報告。 支持ROOT和非ROOT安卓手機，支持越獄iOS系統。（詳情：https://github.com/Tencent/WeTest-Assistant）

28、QT4i★Star 44

QT4i是iOS應用程序的QTA測試自動化驅動程序。主要特性：輕松易用、支持iOS Native控件，webview控件和自定義控件；平臺支持，高效維護。（詳情：https://github.com/Tencent/QT4i）

29、KNVProtoEngine★Star 44

KNV是一個模式自由的高性能樹型協議處理引擎，是對Key-Value的一個通用結構化擴展。（詳情：

https://github.com/Tencent/KNVProtoEngine）

30、優圖人臉識別Python_sdk★Star 32

優圖人臉識別(Face Recognition), 是由騰訊優圖團隊研發的，基于人的臉部特征信息進行身份識別的一種生物識別技術。它提供了"人臉檢測與分析"、“人臉比對”、“人臉驗證”、"人臉識別"等一整套技術方案。（詳情：

https://github.com/TencentYouTu/python_sdk）

WF是一種Adobe Flash文件格式，通常用于在Web瀏覽器中播放動畫或嵌入式音頻/視頻。要打開SWF文件，以下兩種選項可以任選其一：

第一種 Adobe Flash Player

Adobe Flash Player是打開SWF文件的官方軟件，可以通過雙擊SWF文件或在Adobe Flash Player中打開SWF文件。

第二種 Web瀏覽器

使用最新版本的Web瀏覽器（如Google Chrome），則可以直接在瀏覽器中打開SWF文件。只需右鍵單擊SWF文件，然后選擇“在瀏覽器中打開”選項即可。

但是隨著HTML5技術的普及，越來越多的網站已經停止使用Flash插件，這使得SWF格式的文件難以在現代的網頁瀏覽器中播放。因此，將SWF格式轉換為MP4格式可以幫助我們讓SWF文件在更多的設備和平臺上播放，提高了文件的可用性和實用性。

SWF轉換方式（轉MP4）

MP4格式被廣泛應用于各種設備和平臺，包括iOS、Android、Windows和Mac等，因此將SWF格式轉換為MP4格式可以讓文件在更廣泛的設備和平臺上播放。

如果你正在尋找一款優秀的視頻轉換工具，那么迅捷視頻工具箱是一個值得考慮的選擇。它可以轉換幾乎所有常見的視頻格式，包括MP4、AVI、MOV、MKV、FLV等等。

該工具支持批量轉換功能，可以同時轉換多個視頻文件。只需要將需要轉換的SWF文件導入，即可點擊轉換，高效的轉換算法，可以快速轉換大量視頻文件。

對于需要在多個設備和平臺上播放的多媒體文件，SWF轉MP4是一個必要的步驟。

言

前不久抽空對目前比較火的視頻直播，做了下研究與探索，了解其整體實現流程，以及探討移動端HTML5直播可行性方案。

發現目前 WEB 上主流的視頻直播方案有 HLS 和 RTMP，移動 WEB 端目前以 HLS 為主（HLS存在延遲性問題，也可以借助 video.js 采用RTMP），PC端則以 RTMP 為主實時性較好，接下來將圍繞這兩種視頻流協議來展開H5直播主題分享。

一、視頻流協議HLS與RTMP

1. HTTP Live Streaming

HTTP Live Streaming（簡稱 HLS）是一個基于 HTTP 的視頻流協議，由 Apple 公司實現，Mac OS 上的 QuickTime、Safari 以及 iOS 上的 Safari 都能很好的支持 HLS，高版本 Android 也增加了對 HLS 的支持。一些常見的客戶端如：MPlayerX、VLC 也都支持 HLS 協議。

HLS 協議基于 HTTP，而一個提供 HLS 的服務器需要做兩件事：

編碼：以 H.263 格式對圖像進行編碼，以 MP3 或者 HE-AAC 對聲音進行編碼，最終打包到 MPEG-2 TS（Transport Stream）容器之中；分割：把編碼好的 TS 文件等長切分成后綴為 ts 的小文件，并生成一個 .m3u8 的純文本索引文件；瀏覽器使用的是 m3u8 文件。m3u8 跟音頻列表格式 m3u 很像，可以簡單的認為 m3u8 就是包含多個 ts 文件的播放列表。播放器按順序逐個播放，全部放完再請求一下 m3u8 文件，獲得包含最新 ts 文件的播放列表繼續播，周而復始。整個直播過程就是依靠一個不斷更新的 m3u8 和一堆小的 ts 文件組成，m3u8 必須動態更新，ts 可以走 CDN。一個典型的 m3u8 文件格式如下：

#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=200000
gear1/prog_index.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=311111
gear2/prog_index.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=484444
gear3/prog_index.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1, BANDWIDTH=737777
gear4/prog_index.m3u8

可以看到 HLS 協議本質還是一個個的 HTTP 請求 / 響應，所以適應性很好，不會受到防火墻影響。但它也有一個致命的弱點：延遲現象非常明顯。如果每個 ts 按照 5 秒來切分，一個 m3u8 放 6 個 ts 索引，那么至少就會帶來 30 秒的延遲。如果減少每個 ts 的長度，減少 m3u8 中的索引數，延時確實會減少，但會帶來更頻繁的緩沖，對服務端的請求壓力也會成倍增加。所以只能根據實際情況找到一個折中的點。

對于支持 HLS 的瀏覽器來說，直接這樣寫就能播放了：

<video src=”./bipbopall.m3u8″ height=”300″ width=”400″  preload=”auto” autoplay=”autoplay” loop=”loop” webkit-playsinline=”true”></video>

注意：HLS 在 PC 端僅支持safari瀏覽器，類似chrome瀏覽器使用HTML5 video

標簽無法播放 m3u8 格式，可直接采用網上一些比較成熟的方案，如：sewise-player、MediaElement、videojs-contrib-hls、jwplayer。

程序猿的生活：web前端全棧資料粉絲福利（面試題、視頻、資料筆記，進階路線）zhuanlan.zhihu.com/p/136454207

2. Real Time Messaging Protocol

Real Time Messaging Protocol（簡稱 RTMP）是 Macromedia 開發的一套視頻直播協議，現在屬于 Adobe。這套方案需要搭建專門的 RTMP 流媒體服務如 Adobe Media Server，并且在瀏覽器中只能使用 Flash 實現播放器。它的實時性非常好，延遲很小，但無法支持移動端 WEB 播放是它的硬傷。

雖然無法在iOS的H5頁面播放，但是對于iOS原生應用是可以自己寫解碼去解析的, RTMP 延遲低、實時性較好。瀏覽器端，HTML5 video

標簽無法播放 RTMP 協議的視頻，可以通過 video.js 來實現。

<link href=“http://vjs.zencdn.net/5.8.8/video-js.css” rel=“stylesheet”>
<video id=“example_video_1″ class=“video-js vjs-default-skin” controls preload=“auto” width=“640” height=“264” loop=“loop” webkit-playsinline>
<source src=“rtmp://10.14.221.17:1935/rtmplive/home” type=‘rtmp/flv’>
</video>
<script src=“http://vjs.zencdn.net/5.8.8/video.js”></script>
<script>
videojs.options.flash.swf = ‘video.swf’;
videojs(‘example_video_1′).ready(function() {
this.play();
});
</script>

3. 視頻流協議HLS與RTMP對比

二、直播形式

目前直播展示形式，通常以YY直播、映客直播這種頁面居多，可以看到其結構可以分成三層：

① 背景視頻層

② 關注、評論模塊

③ 點贊動畫

而現行H5類似直播頁面，實現技術難點不大，其可以通過實現方式分為：

① 底部視頻背景使用video視頻標簽實現播放

② 關注、評論模塊利用 WebScoket 來實時發送和接收新的消息通過DOM 和 CSS3 實現

③ 點贊利用 CSS3 動畫

了解完直播形式之后，接下來整體了解直播流程。

相關學習資料推薦，點擊下方鏈接免費報名，先碼住不迷路~】

音視頻免費學習地址：FFmpeg/WebRTC/RTMP/NDK/Android音視頻流媒體高級開發

【免費分享】音視頻學習資料包、大廠面試題、技術視頻和學習路線圖，資料包括（C/C++，Linux，FFmpeg webRTC rtmp hls rtsp ffplay srs 等等）有需要的可以點擊788280672加群免費領取~

三、直播整體流程

直播整體流程大致可分為：

視頻采集端：可以是電腦上的音視頻輸入設備、或手機端的攝像頭、或麥克風，目前以移動端手機視頻為主。

直播流視頻服務端：一臺Nginx服務器，采集視頻錄制端傳輸的視頻流(H264/ACC編碼)，由服務器端進行解析編碼，推送RTMP/HLS格式視頻流至視頻播放端。

視頻播放端：可以是電腦上的播放器（QuickTime Player、VLC），手機端的native播放器，還有就是 H5 的video標簽等，目前還是以手機端的native播放器為主。

（web前端學習交流群：328058344 禁止閑聊，非喜勿進！）

四、H5 錄制視頻

對于H5視頻錄制，可以使用強大的 webRTC （Web Real-Time Communication）是一個支持網頁瀏覽器進行實時語音對話或視頻對話的技術，缺點是只在 PC 的 Chrome 上支持較好，移動端支持不太理想。

使用 webRTC 錄制視頻基本流程

① 調用 window.navigator.webkitGetUserMedia()

獲取用戶的PC攝像頭視頻數據。

② 將獲取到視頻流數據轉換成 window.webkitRTCPeerConnection

(一種視頻流數據格式)。

③ 利用 WebScoket

將視頻流數據傳輸到服務端。

注意：

雖然Google一直在推WebRTC，目前已有不少成型的產品出現，但是大部分移動端的瀏覽器還不支持 webRTC（最新iOS 10.0也不支持），所以真正的視頻錄制還是要靠客戶端（iOS,Android）來實現,效果會好一些。

WebRTC支持度

WebRTC支持度

iOS原生應用調用攝像頭錄制視頻流程

① 音視頻的采集，利用AVCaptureSession和AVCaptureDevice可以采集到原始的音視頻數據流。

② 對視頻進行H264編碼，對音頻進行AAC編碼，在iOS中分別有已經封裝好的編碼庫（x264編碼、faac編碼、ffmpeg編碼）來實現對音視頻的編碼。

③ 對編碼后的音、視頻數據進行組裝封包。

④ 建立RTMP連接并上推到服務端。

五、搭建Nginx+Rtmp直播流服務

安裝nginx、nginx-rtmp-module

① 先clone nginx項目到本地：

brew tap homebrew/nginx

② 執行安裝nginx-rtmp-module

brew install nginx-full –with-rtmp-module

2. nginx.conf配置文件，配置RTMP、HLS

查找到nginx.conf配置文件（路徑/usr/local/etc/nginx/nginx.conf），配置RTMP、HLS。

① 在http節點之前添加 rtmp 的配置內容：

② 在http中添加 hls 的配置

3. 重啟nginx服務

重啟nginx服務，瀏覽器中輸入 http://localhost:8080，是否出現歡迎界面確定nginx重啟成功。

nginx -s reload

六、直播流轉換格式、編碼推流

當服務器端接收到采集視頻錄制端傳輸過來的視頻流時，需要對其進行解析編碼，推送RTMP/HLS格式視頻流至視頻播放端。通常使用的常見編碼庫方案，如x264編碼、faac編碼、ffmpeg編碼等。鑒于 FFmpeg 工具集合了多種音頻、視頻格式編碼，我們可以優先選用FFmpeg進行轉換格式、編碼推流。

1.安裝 FFmpeg 工具

brew install ffmpeg

2.推流MP4文件

視頻文件地址：/Users/gao/Desktop/video/test.mp4

推流拉流地址：rtmp://localhost:1935/rtmplive/home，rtmp://localhost:1935/rtmplive/home

//RTMP 協議流
ffmpeg -re -i /Users/gao/Desktop/video/test.mp4 -vcodec libx264 -acodec aac -f flv rtmp://10.14.221.17:1935/rtmplive/home
//HLS 協議流
ffmpeg -re -i /Users/gao/Desktop/video/test.mp4 -vcodec libx264 -vprofile baseline -acodec aac -ar 44100 -strict -2 -ac 1 -f flv -q 10 rtmp://10.14.221.17:1935/hls/test

注意：

當我們進行推流之后，可以安裝VLC、ffplay（支持rtmp協議的視頻播放器）本地拉流進行演示

3.FFmpeg推流命令

① 視頻文件進行直播

ffmpeg -re -i /Users/gao/Desktop/video/test.mp4 -vcodec libx264 -vprofile baseline -acodec aac -ar 44100 -strict -2 -ac 1 -f flv -q 10 rtmp://192.168.1.101:1935/hls/test
ffmpeg -re -i /Users/gao/Desktop/video/test.mp4 -vcodec libx264 -vprofile baseline -acodec aac -ar 44100 -strict -2 -ac 1 -f flv -q 10 rtmp://10.14.221.17:1935/hls/test

② 推流攝像頭＋桌面+麥克風錄制進行直播

ffmpeg -f avfoundation -framerate 30 -i “1:0″ \-f avfoundation -framerate 30 -video_size 640x480 -i “0” \-c:v libx264 -preset ultrafast \-filter_complex ‘overlay=main_w-overlay_w-10:main_h-overlay_h-10′ -acodec libmp3lame -ar 44100 -ac 1 -f flv rtmp://192.168.1.101:1935/hls/test

更多命令，請參考：

FFmpeg處理RTMP流媒體的命令大全

FFmpeg常用推流命令

七、H5 直播視頻播放

移動端iOS和 Android 都天然支持HLS協議，做好視頻采集端、視頻流推流服務之后，便可以直接在H5頁面配置 video 標簽播放直播視頻。

<video controls preload=“auto” autoplay=“autoplay” loop=“loop” webkit-playsinline>
<source src=“http://10.14.221.8/hls/test.m3u8″ type=“application/vnd.apple.mpegurl” />
<p class=“warning”>Your browser does not support HTML5 video.</p>
</video>

八、總結

本文從視頻采集上傳，服務器處理視頻推流，以及H5頁面播放直播視頻一整套流程,具體闡述了直播實現原理，實現過程中會遇到很多性能優化問題。

① H5 HLS 限制必須是H264+AAC編碼。

② H5 HLS 播放卡頓問題，server 端可以做好分片策略，將 ts 文件放在 CDN 上，前端可盡量做到 DNS 緩存等。

③ H5 直播為了達到更好的實時互動，也可以采用RTMP協議，通過video.js 實現播放。

原文 https://zhuanlan.zhihu.com/p/146323842