WebRTC技術詳解：從0到1構建多人視頻會議系統

前言

第1章　WebRTC概述1
1.1　WebRTC的歷史1
1.2　WebRTC的技術架構2
1.3　WebRTC的網路拓撲3
1.4　Simulcast聯播4
1.5　可伸縮視頻編碼5
1.6　WebRTC的相容性5
1.7　其他直播技術6
1.8　統一計畫與Plan B8
1.9　本章小結9

第2章　本地媒體10
2.1　媒體流10
2.1.1　構造媒體流11
2.1.2　MediaStream屬性11
2.1.3　MediaStream方法11
2.1.4　MediaStream事件14
2.2　媒體軌道15
2.2.1　MediaStreamTrack屬性15
2.2.2　MediaStreamTrack方法17
2.2.3　MediaStreamTrack事件20
2.3　媒體約束22
2.3.1　約束類型22
2.3.2　資料類型與用法23
2.3.3　通用約束25
2.3.4　視頻約束25
2.3.5　音訊約束25
2.3.6　螢幕共用約束26
2.3.7　圖像約束26
2.3.8　約束的advanced屬性27
2.4　媒體設備28
2.4.1　WebRTC隱私和安全28
2.4.2　獲取攝像頭與話筒29
2.4.3　共用螢幕30
2.4.4　查詢媒體設備31
2.4.5　監聽媒體設備變化33
2.5　從canvas獲取媒體流34
2.6　從媒體元件獲取媒體流34
2.7　播放媒體流35
2.8　錄製媒體流36
2.8.1　構造MediaRecorder36
2.8.2　MediaRecorder屬性37
2.8.3　MediaRecorder方法39
2.8.4　MediaRecorder事件42
2.9　示例45
2.9.1　代碼結構45
2.9.2　獲取圖片圖元資料46
2.9.3　替換視頻背景47
2.10　本章小結48

第3章　傳輸技術49
3.1　RTP49
3.2　RTCP52
3.3　SRTP/SRTCP54
3.4　TLS/DTLS55
3.5　SDP55
3.6　ICE57
3.7　搭建STUN/TURN伺服器63
3.8　本章小結65

第4章　連接管理66
4.1　WebRTC建立連接的過程66
4.1.1　會話描述資訊RTCSession-Description69
4.1.2　pending狀態與current狀態70
4.1.3　ICE候選者RTCIceCandidate70
4.2　RTCPeerConnection介面72
4.2.1　構造函數RTCPeerConnection73
4.2.2　連接配置RTCConfiguration74
4.2.3　RTCPeerConnection介面的屬性76
4.2.4　RTCPeerConnection介面的方法82
4.2.5　RTCPeerConnection介面的事件90
4.3　完美協商模式94
4.3.1　SDP衝突問題95
4.3.2　使用完美協商模式95
4.3.3　再談ICE重啟97
4.4　示例98
4.4.1　運行示例98
4.4.2　使用WebSocket99
4.4.3　創建RTCPeerConnection的時機100
4.5　本章小結102

第5章　RTP媒體管理103
5.1　WebRTC編解碼104
5.2　RTCPeerConnection RTP擴展110
5.2.1　RTCPeerConnection擴展方法111
5.2.2　RTCPeerConnection擴展事件113
5.3　傳輸媒體流114
5.3.1　無流軌道115
5.3.2　有流軌道115
5.4　RTP收發管理116
5.4.1　RTCRtpTransceiver屬性117
5.4.2　RTCRtpTransceiver方法118
5.5　RTP發送器118
5.5.1　RTCRtpSender屬性119
5.5.2　RTCRtpSender方法119
5.6　RTP接收器123
5.6.1　RTCRtpReceiver屬性123
5.6.2　RTCRtpReceiver方法123
5.7　DTLS傳輸層126
5.7.1　RTCDtlsTransport屬性126
5.7.2　RTCDtlsTransport方法127
5.7.3　RTCDtlsTransport事件127
5.8　ICE傳輸層128
5.8.1　RTCIceTransport屬性128
5.8.2　RTCIceTransport方法130
5.8.3　RTCIceTransport事件132
5.9　使用DTMF134
5.9.1　RTCDTMFSender屬性134
5.9.2　RTCDTMFSender方法135
5.9.3　RTCDTMFSender事件135
5.10　RTC錯誤處理136
5.11　通話的掛起與恢復137
5.11.1　通話掛起137
5.11.2　通話恢復138
5.12　示例139
5.12.1　 動態設置視頻碼率140
5.12.2　 使用VP9和H264141
5.12.3　使用虛擬背景144
5.13　本章小結145

第6章　信令伺服器146
6.1　使用Node.js147
6.2　使用TypeScript156
6.3　使用Express164
6.4　使用Socket.IO173
6.5　實現信令伺服器179
6.6　實現信令用戶端186
6.7　示例189
6.8　本章小結191

第7章　資料通道192
7.1　SCTP192
7.2　RTCPeerConnection資料通道擴展介面196
7.3　RTCSctpTransport199
7.4　RTCDataChannel200
7.5　帶內協商與帶外協商206
7.6　文字聊天與檔案傳輸206
7.7　本章小結216

第8章　統計資料217
8.1　統計資料入口217
8.2　RTCStats及其擴展219
8.3　即時碼率監測241
8.3.1　使用Chart.js242
8.3.2　獲取碼率資料244
8.4　本章小結247

第9章　移動端WebRTC248
9.1　原生應用與混合應用248
9.2　原生開發環境249
9.2.1　Android原生開發環境249
9.2.2　iOS原生開發環境250
9.3　WebView251
9.4　Cordova252
9.4.1　編譯環境253
9.4.2　全域配置config.xml254
9.4.3　應用程式列為preference258
9.4.4　應用程式圖示icon261
9.4.5　簡單的WebRTC移動應用264
9.4.6　調試Cordova應用267
9.5　Ionic Framework268
9.5.1　安裝與使用269
9.5.2　開發工具269
9.6　基於Ionic的WebRTC移動應用270
9.6.1　使用範本創建應用程式271
9.6.2　首頁組件272
9.6.3　連接管理服務275
9.6.4　視頻與聊天元件281
9.6.5　構建Android應用程式283
9.6.6　構建iOS應用程式285
9.7　本章小結286

第10章　從0到1打造多人視訊會議系統287
10.1　整體設計287
10.2　媒體伺服器289
10.2.1　OWT289
10.2.2　Kurento289
10.2.3　Janus290
10.2.4　Mediasoup291
10.2.5　媒體伺服器的選擇291
10.3　Mediasoup信令交互過程293
10.4　伺服器端實現294
10.4.1　房間與參與者295
10.4.2　管理與監控介面296
10.5　用戶端實現298
10.5.1　發佈媒體流298
10.5.2　訂閱媒體流301
10.5.3　共用桌面303
10.5.4　共用本地媒體303
10.5.5　文檔及白板304
10.5.6　文字聊天307
10.6　傳輸品質監控308
10.7　從網路故障中恢復309
10.8　本章小結310