2014-08-27 26 views
31

我使用getUserMedia()捕獲音頻數據,並且我想將它發送到我的服務器,以便我可以將它作爲Blob保存在MySQL字段中。通過getUserMedia捕獲MediaStream到WebRTC主機服務器

這就是我想要做的。我已經做了幾次嘗試,使用WebRTC來做到這一點,但是我現在甚至都不知道這是否正確,甚至是做到這一點的最佳方式。

可以任何人幫幫我嗎?

這裏是代碼我使用捕捉來自麥克風音頻:

navigator.getUserMedia({ 
    video:false, 
    audio:true, 
},function(mediaStream){ 

    // output mediaStream to speakers: 
    var mediaStreamSource=audioContext.createMediaStreamSource(mediaStream); 
    mediaStreamSource.connect(audioContext.destintion); 

    // send mediaStream to server: 

    // WebRTC code? not sure about this... 
    var RTCconfig={}; 
    var conn=new RTCPeerConnection(RTCconfig); 

    // ??? 

},function(error){ 
    console.log('getUserMedia() fail.'); 
    console.log(error); 
}); 

我怎樣才能發送此mediaStream到服務器?

周圍的Googling之後我一直都盼望到WebRTC但這似乎只是點對點通信 - 實際上,現在我期待這個多了,我覺得這是要走的路。它似乎是從客戶端瀏覽器到主機網絡服務器進行通信的方式,但我嘗試的任何東西甚至都無法正常工作。

我一直在通過the W3C documentation(我發現方式太抽象了),我一直通過this article on HTML5 Rocks(這是提出更多的問題比答案)。顯然我需要一種信令方法,任何人都可以建議哪種信令方法最適合發送mediaStreams,XHR,XMPP,SIP,Socket.io或其他東西?

服務器上需要什麼來支持接收WebRTC?我的網絡服務器正在運行一個基本的LAMP堆棧。

最好等到mediaStream完成錄製後再發送給服務器,還是最好發送mediaStream作爲錄製的內容?我想知道我是否正在以正確的方式做這件事。我已經在JavaScript和HTML5中編寫了文件上傳器,但上傳其中一個mediaStreams似乎更加複雜,我不確定我是否正確處理它。

任何幫助,將不勝感激。

+0

你只想存儲錄製的文件嗎?如果是這樣,您可以將blob上傳到服務器並保存它。或者你想讓你的服務器能夠從客戶端獲得實時流,並讓服務器處理錄製? – 2014-09-02 19:06:00

+0

我只想將記錄的文件存儲在服務器上。 – Jimmery 2014-09-03 11:06:36

回答

29

您在運行時無法上傳直播本身。這是因爲它是實時流。

所以,這給你留下了一些選擇。

  1. 使用衆多錄像機中的一個記錄音頻流RecordRTC工作得很好。等到流完成後再上傳文件。
  2. 用定時器發送更小的錄製音頻塊,並將它們再次合併到服務器端。 This is an example of this
  3. 將音頻數據包通過websockets發送到您的服務器,以便您可以在那裏操作和合並它們。 My version of RecordRTC does this
  4. 與您的服務器建立實際的對等連接,以便獲取原始rtp流,並且可以使用一些較低級別的代碼記錄流。這可以通過Janus-Gateway輕鬆完成。

至於等待發送流與發送塊,這一切都取決於你錄製多長時間。如果時間較長,我會說發送數據塊或者通過websockets主動發送音頻數據包是一個更好的解決方案,因爲從客戶端上傳和存儲較大的音頻文件對於客戶端來說可能是艱鉅的。

Firefox實際上有一個它的own solution for recording,但它在chrome中不受支持,因此它可能不適用於您的情況。

另外,所提及的信號傳輸方法是用於會話建立/銷燬,而且與媒體本身無關。如果您正在使用上面顯示的可能的解決方案編號4,那麼您只會擔心這一點。

3

對你而言,一個好的API應該是MediaRecorder API,但它比Web Audio API支持的更少,所以你可以使用ScriptNode或使用Recorder.js(或基於它來構建你自己的腳本節點)。

相關問題