Kurento Utils JS

時間 2017-02-17

原文 https://my.oschina.net/997155658/blog/840771

概述

Kurento Utils是RTCPeerConnection的包裝器對象。此對象旨在簡化基於WebRTC的應用程序的開發。

該項目的源代碼可以從GitHub存儲庫克隆。

怎麼使用它

Minified file - 點擊這兒下載.
NPM - NodeJS 中安裝使用.

npm install kurento-utils

var utils = require('kurento-utils');

Bower - 生成的 bundled 腳本文件

bower install kurento-utils

導入庫到您的html頁面

<script src="bower_components/kurento-utils/js/kurento-utils.js"></script>

Examples

有幾個教程展示了使用Java，Node和JavaScript開發的完整WebRTC應用程序中使用的kurento-utils。這些教程在GitHub中，您可以隨時下載和運行它們。

Java - https://github.com/Kurento/kurento-tutorial-java
Node - https://github.com/Kurento/kurento-tutorial-node
JavaScript -https://github.com/Kurento/kurento-tutorial-js

在下面幾行中，我們將演示如何使用庫來創建RTCPeerConnection，以及如何協商與另一個對等體的連接。庫提供了一個WebRtcPeer對象，它是瀏覽器的RTCPeerConnection API的包裝器。對等連接可以是不同類型：單向（僅發送或接收）或雙向（發送和接收）。以下代碼顯示如何創建後者，以便能夠發送和接收媒體（音頻和視頻）。代碼假設在加載腳本的網頁中有兩個視頻代碼。這些標籤將用於顯示由您自己的客戶端瀏覽器捕獲的視頻，以及從其他對等方接收的媒體。構造函數接收一個屬性，該屬性包含配置所需的所有信息。

var videoInput = document.getElementById('videoInput');
 var videoOutput = document.getElementById('videoOutput');

 var constraints = {
     audio: true,
     video: {
       width: 640,
       framerate: 15
     }
 };

 var options = {
   localVideo: videoInput,
   remoteVideo: videoOutput,
   onicecandidate : onIceCandidate,
   mediaConstraints: constraints
 };


var webRtcPeer = kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, function(error) {
      if(error) return onError(error)

      this.generateOffer(onOffer)
});

有了這個小代碼，庫負責創建RTCPeerConnection，並在瀏覽器中調用getUserMedia（如果需要）。若constraints屬性在調用中使用，在這種情況下，將使用麥克風和網絡攝像頭。但是，這不會創建連接。這只有在完成對等體之間的SDP協商之後才能實現。這個過程意味着交換SDP提供和回答，並且由於使用了Trickle ICE，描述每個對等體的能力的多個候選者。談判的工作原理超出了本文件的範圍。更多信息可以在這個鏈接中找到。

在上一段代碼中，當webRtcPeer對象被創建時，使用this.generateOffer（onOffer）生成SDP。傳遞的唯一參數是一個函數，它將在瀏覽器的對等連接生成該提議時調用。 onOffer回調方法負責通過您的應用程序中設計的任何方法將此提議發送給其他對等方。由於這是每個特定應用程序的信令面和業務邏輯的一部分，因此本文檔中將不涉及。

假設SDP提議已經被遠程對等體接收到，則它必須已經生成SDP應答，該SDP應答應該被接收。此回答必須由webRtcEndpoint處理，以便完成協商。這可以是onOffer回調函數的實現。我們假設在範圍中有一個函數，允許發送SDP到遠程對等體。

function onOffer(error, sdpOffer) {
  if (error) return onError(error);

  // We've made this function up sendOfferToRemotePeer(sdpOffer,
  function(sdpAnswer) {
    webRtcPeer.processAnswer(sdpAnswer);
  });
}

正如我們之前所說的，庫假設使用Trickle ICE來完成兩個對等體之間的連接。在webRtcPeer的配置中，有一個對onIceCandidate回調函數的引用。庫將使用此函數將ICE候選項發送到遠程對等體。由於這是每個應用程序的特性，我們將只顯示簽名。

function onIceCandidate(candidate) {
  // Send the candidate to the remote peer
}

反過來，我們的客戶端應用程序必須能夠從遠程對等體接收ICE候選。假設信令關注接收那些候選，則足以在webRtcPeer中調用以下方法來考慮ICE候選。

webRtcPeer.addIceCandidate(candidate);

按照前面的步驟，我們有：

發送SDP，提供給遠程對等體
從遠程對等體接收到SDP應答，並讓webRtcPeer進程回答。
在對等體之間交換ICE候選者，通過發送在瀏覽器中生成的ICE候選者，以及處理由遠程對等體接收的候選者。

完成協商過程，並且應該讓我們在兩個對等體之間進行有效的雙向WebRTC媒體交換。

使用 data channels

WebRTC數據通道允許您通過活動的WebRTC連接發送文本或二進制數據。 WebRtcPeer對象可以通過使用RTCDataChannel形式的RTCPeerConnection對象來提供對此功能的訪問。這允許您注入和使用管道中的數據。這些數據可以被不同的每個端點處理。例如，瀏覽器中的WebRtcPeer對象將具有與RTCDataChannel相同的行爲（您可以在此處查看說明）。其他端點可以利用該信道來發送信息：檢測視頻流中的QR碼的過濾器可以通過數據信道將檢測到的碼發送給客戶端。這個特殊的行爲應該在過濾器中指定。

通過在選項包中傳遞dataChannels標誌以及所需的選項來指示WebRtcPeer對象中數據通道的使用。

var options = {
     localVideo : videoInput,
     remoteVideo : videoOutput,
     dataChannels : true,
     dataChannelConfig: {
       id : getChannelName(),
       onmessage : onMessage,
       onopen : onOpen,
       onclose : onClosed,
       onbufferedamountlow : onbufferedamountlow,
       onerror : onerror
     },
     onicecandidate : onIceCandidate
 }

 webRtcPeer = new kurentoUtils.WebRtcPeer.WebRtcPeerSendrecv(options, onWebRtcPeerCreated);

dataChannelConfig中的值都是可選的。一旦webRtcPeer對象被創建，並且在成功協商連接之後，用戶可以通過數據通道發送數據。

webRtcPeer.send('your data stream here');

您要發送的數據的格式由應用程序以及您使用的端點的定義決定。

底層RTCDataChannel的生命週期與webRtcPeer的生命週期相關：當調用webRtcPeer.dispose（）方法時，數據通道將被關閉並釋放。

文檔參考

WebRtcPeer

WebRtcPeer的構造函數是WebRtcPeer(mode，options，callback)其中：

mode：配置PeerConnection的模式。有效值爲:

recv：只接收媒體。

send：只發送媒體。

sendRecv：發送並接收媒體。
options：它是一組參數，它們是可選的。它是一個json對象。

localVideo：應用程序中本地流的視頻標記。

remoteVideo：應用程序中遠程流的視頻標記。

videoStream：提供已經可用的視頻流，而不是使用來自本地網絡攝像頭的媒體流。

audioStreams：提供已經可用的音頻流代替使用來自本地麥克風的媒體流。

mediaConstraints：定義視頻和音頻的質量。

connectionConstraints：根據瀏覽器定義連接約束，如googIPv6，DtlsSrtpKeyAgreement ...

peerConnection：使用以前創建的peerConnection

sendSource：將使用哪個源
```
- webcam

  - screen

  - window
```
onstreamended：當流結束事件發生時將被調用的方法

onicecandidate：當冰候選事件發生時將被調用的方法

oncandidategatheringdone：當所有候選項都已被收集時將調用的方法

dataChannels：啓用數據通道使用的標誌。如果爲true，那麼將在RTCPeerConnection對象中創建一個數據通道。

dataChannelConfig：這是一個JSON對象，該配置通過DataChannel傳遞並創建。它支持以下鍵：
```
-id：指定數據通道的id。 如果沒有指定，將使用WebRtcPeer對象的相同id。

  -options：傳遞給數據通道構造函數的選項對象。

  -onopen：在數據通道的onopen事件中調用的函數，當通道打開時觸發。

  -onclose：在數據通道的onclose事件中調用的函數，當數據通道關閉時觸發。

  -onmessage：在數據通道的onmessage事件中調用的函數。 每次接收到消息時觸發此事件。

  -onbufferedamountlow：當接收bufferedamountlow事件時調用事件處理程序。 當RTCDataChannel.bufferedAmount下降到小於或等於RTCDataChannel.bufferedAmountLowThreshold屬性指定的量時，將發送此類事件。

  -onerror：當數據通道產生錯誤時，調用回調函數。 如果沒有提供，將在瀏覽器控制檯中記錄錯誤跟蹤消息。
```
simulcast：指示是否要使用聯播。值爲true | false

configuration：它是一個JSON對象，ICE服務器定義使用
```
-iceServers：此變量的格式如下：
  [{"urls":"turn:turn.example.org","username":"user","credential":"myPassword"}]
  [{"urls":"stun:stun1.example.net"},{"urls":"stun:stun2.example.net"}]
```
callback：它是一個指示回調函數，判斷一切正常與否。

還有3種特定的方法來創建WebRtcPeer對象而不使用mode參數：

-WebRtcPeerRecvonly(options, callback): 創建一個只接收的WebRtcPeer。

-WebRtcPeerSendonly(options, callback): 創建一個只發送的WebRtcPeer。

-WebRtcPeerSendrecv(options, callback): 創建一個發送和接收的WebRtcPeer。

MediaConstraints

MediaConstraints提供了通用的界面控制，允許應用程序爲軌道選擇適當的源，並且一旦選擇，就影響源如何操作。 getUserMedia() 使用MediaConstraints來幫助軌道選擇適當的源並配置它。有關MediaConstraints及其值的詳細信息，可以在此處查看。

默認情況下，如果mediaConstraints未定義，當調用getUserMedia時將使用此約束：

{
  audio: true,
  video: {
    width: 640,
    framerate: 15
  }
}

如果mediaConstraints有值，庫將使用此值來調用getUserMedia。這取決於瀏覽器是否接受這些約束。

在示例部分中，有一個關於使用媒體約束的示例。

Methods

getPeerConnection

使用這種方法，用戶可以獲得peerConnection並直接使用它。
showLocalVideo

使用這個方法顯示本地視頻
getLocalStream

使用此方法，用戶可以獲取本地流。如果此屬性爲true，則可以使用muted屬性來隱藏音頻。
getRemoteStream

使用此方法，用戶可以獲取遠程流。
getCurrentFrame

使用這種方法，用戶可以獲得當前幀並獲得具有當前幀的圖像的畫布。
processAnswer

收到SDP應答時調用回調函數。開發人員需要調用此功能才能完成SDP協商。此方法有兩個參數：
- sdpAnswer: sdpAnswer描述
- callback: 它是一個具有類似錯誤函數的參數。當遠程描述已成功設置時調用。
processOffer

收到SDP提議時調用回調函數。開發人員需要調用此功能才能完成SDP協商。此方法有兩個參數：

-sdpOffer: sdpOffer描述 -callback: 它是一個具有類似錯誤函數的參數。當遠程描述已成功設置時調用。
dispose

此方法釋放WebRtcPeer使用的資源。
addIceCandidate

在接收ICE候選時調用回調函數。開發人員需要調用此功能才能完成SDP協商。此方法有兩個參數：

-iceCandidate: 文本對象與ICE候選描述 -callback: 它是一個具有類似錯誤函數的參數。當遠程描述已成功設置時調用。
getLocalSessionDescriptor

使用這種方法，用戶可以獲得對等體連接的本地會話描述符。
getRemoteSessionDescriptor

使用這種方法，用戶可以獲得對等連接的遠程會話描述符。
generateOffer

創建用於查找具有指定配置的遠程對等項的請求。

如何做屏幕共享

屏幕窗口共享取決於私有模塊kurento-browser-extensions。要啓用它的支持，您需要手動安裝包依賴關係或在運行時自己提供getScreenConstraints函數。在創建WebRtcEndpoint之前，sendSource選項可以是窗口或屏幕。如果它不可用，當您試圖共享屏幕或窗口內容將拋出異常。

Souce code

源代碼託管在GitHub

確保在您的系統中安裝了Node.js和Bower：

curl -sL https://deb.nodesource.com/setup | sudo bash -
sudo apt-get install -y nodejs
sudo npm install -g bower

安裝庫，建議從NPM鏡像庫執行此操作：

npm install kurento-utils

或者，您可以使用Git下載代碼，並手動安裝其依賴關係：

git clone https://github.com/Kurento/kurento-utils
cd kurento-utils
npm install

Build for browser

下載項目後，要構建瀏覽器版本的庫，您只需要執行grunt任務。所需的文件將在dist文件夾中生成。或者，如果您沒有全局安裝，您可以通過執行以下命令來運行本地副本：

cd kurento-utils
node_modules/.bin/grunt

1. Kurento簡介
2. Kurento日構建
3. Kurento API 參考
4. 【js】js 總結，提供公共utils js
5. Kurento應用開發指南(以Kurento 6.0爲模板) 之七：Kurento API 參考
6. Kurento Tree 簡介
7. What's Kurento
8. Kurento Modules
9. Utils
10. utils
更多相關文章...

利用kurento-util-js做屏幕共享（kurento-browser-extensions）

Kurento Utils JS

概述

怎麼使用它

Examples

使用 data channels

文檔參考

Souce code

Build for browser

用ffmpeg將mp3轉爲wav

centos搭建janus服務器

ice交互的深度好文

webrtc服務器janus android客戶端編譯學習三

聊一聊分佈式鎖的設計（轉）

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結