聯繫我們

課程簡介

媒體設備處理

1. 使用 navigator.permissions 處理瀏覽器權限

  • 訪問硬件:
    • 網絡攝像頭
    • 麥克風
  • 可選權限:
    • 地理位置
    • 通知
    • 剪貼板(讀/寫)
  • 權限查詢與狀態
  • 限制條件與瀏覽器兼容性

2. 使用 navigator.mediaDevices 讀取媒體設備

  • 設備列舉
  • 處理設備變更

3. 跨瀏覽器兼容性

  • API 使用:
    • navigator.permissions.query()
    • navigator.mediaDevices.enumerateDevices()
    • getUserMedia()
  • Safari 回退策略

4. 媒體設備處理

  • 設備初始化:getUserMedia(constraints)
  • 媒體設備限制條件
  • 啟動和停止媒體流
  • 處理設備變更

5. 使用 MediaRecorder 錄音

  • 開始/停止串流與錄音
  • 下載 .webm 文件
  • 實時波形預覽

可選附加組件:

  • 使用 ScriptProcessorNode 保存為 .wav 格式
  • 音頻 FFT 聲譜可视化
  • 分貝音量條
  • 利用 webkitSpeechRecognition 進行語音識別

對等連接

1. 信號服務器

  • 雙向通道選項:
    • WebSocket
    • Socket.io
    • SignalR
  • 消息結構
  • 簡化版 WebRTC 客戶端
  • 完整的信號流程

2. 通過 WebRTC 進行視頻聊天

  • 架構:Node.js + ws
  • WebRTC 客戶端:RTCPeerConnection
  • 本地端到端測試

可選功能:

  • 掛斷電話(關閉連接、停止媒體)
  • 群組呼叫(多用戶房間)
  • 基於令牌的簡單身份驗證

3. 屏幕共享

  • 使用 getDisplayMedia()
  • 架構與選項

4. 會話描述協議 (SDP)

  • 介紹與內容
  • 閱讀與解釋 SDP
  • 編碼器:
    • 音頻與視頻
    • 協商與控制
    • 回退策略

5. 使用 getStats() 獲取 WebRTC 統計數據

  • 統計數據類型
  • 如何解讀統計數據
  • 實時比特率/抖動圖表
  • 質量適應策略

6. 所有主題均為

  • 動手實踐用例

最低要求

本課程最適合構建基於瀏覽器的實時通信功能(如視頻聊天、屏幕共享或音頻串流)的前端和全棧開發者、技術架構師以及工程師。參與者應具備 JavaScript 和 Web 技術的實用知識,並可選具備 Node.js 及基於 WebSocket 的通信經驗。

 14 小時

人數


每位參與者的報價

客戶評論 (3)

即將到來的課程

課程分類