2013-07-26 13 views
5

Ho bisogno di creare un'applicazione web che utilizzi WebRTC per ottenere streaming video di webcam e streaming audio microfonico e tradurlo immediatamente sul server per ulteriori trasmissioni a più client. L'app deve eseguirla in tempo reale in full duplex. Voglio dire che sarebbe una specie di chat video dal vivo. Sarebbe una sorta di app educativa. Quindi la domanda è: è possibile ora? Quali tecnologie dovrei usare? Dovrei usare WebRTC con WebSocket e Node.js sul back-end? Oppure posso usare php anziché node? Posso usare Socket.io per quello? Esistono altri modi per raggiungere questo obiettivo? Potrebbe essere un flash?È ora possibile utilizzare l'API GetUserMedia per leggere il flusso video dalla webcam e inviarlo direttamente al server per ulteriori trasmissioni?

risposta

4

L'API PeerConnection in WebRTC non richiede un server back-end per eseguire una o più connessioni tra peer.

L'unica cosa per cui è necessario un server back-end è di fungere da mediatore per stabilire prima le connessioni tra i peer. A tal fine, è possibile utilizzare l'API WebSocket, Ajax o qualsiasi altro mezzo necessario per raggiungere tale obiettivo. Inoltre, sì, puoi usare PHP per scrivere sul lato server per WebSocket (o qualsiasi altro metodo tu voglia usare per stabilire la connessione peer-to-peer). Dipende davvero da te.

Al momento, solo Chrome e Firefox supportano un numero sufficiente di API WebRTC per rendere possibile la chat video. Ben presto, tuttavia, Opera probabilmente si unirà al mix, ma nessuno è ancora sicuro se WebRTC sarà aggiunto a IE11 o no, e Apple sembra non avere intenzione di aggiungere WebRTC a Safari in qualsiasi momento (perché hanno la loro tecnologia proprietaria per quello suona familiare ?!).

In ogni caso, WebRTC è la soluzione migliore. Come nota aggiuntiva, non penso sia possibile utilizzare JS per inviare video e audio a un server, e quindi fare in modo che il server li trasmetta agli altri peer. Invece, è necessario utilizzare WebRTC per stabilire connessioni peer-to-peer e quindi passare da lì.

Edit: Se si utilizza un server TURN, è possibile reindirizzare i dati audio e video attraverso un server, ma questo è in realtà la situazione almeno ideale, ed è ancora possibile farlo solo se si sta utilizzando l'API WebRTC .

+0

Grazie per la risposta! So che WebRTC è in grado di connettere i browser direttamente. Ma ho bisogno di un server web per scopi di autenticazione e autorizzazione. – paperstreet7

+0

E questo dipende completamente da te. È possibile autorizzare e autenticare qualsiasi cosa si desideri e consentire solo la connessione WebRTC se tutto è a posto. – HartleySan

+0

@ paperstreet7 - Sono passati diversi anni ma mi sono imbattuto in un requisito simile, sei riuscito a trovare una soluzione? – po10cySA

2

Può esserti utile.

MediaStreamRecorder è un'API WebRTC per la registrazione di stream getUserMedia() (ancora in fase di implementazione). Consente alle app Web di creare un file da una sessione audio/video live.

Ecco un'implementazione di esempio per l'invio del flusso al server.

<video autoplay></video> 

    <script language="javascript" type="text/javascript"> 
    function onVideoFail(e) { 
     console.log('webcam fail!', e); 
     }; 

    function hasGetUserMedia() { 
     // Note: Opera is unprefixed. 
     return !!(navigator.getUserMedia || navigator.webkitGetUserMedia || 
       navigator.mozGetUserMedia || navigator.msGetUserMedia); 
    } 

    if (hasGetUserMedia()) { 
     // Good to go! 
    } else { 
     alert('getUserMedia() is not supported in your browser'); 
    } 

    window.URL = window.URL || window.webkitURL; 
    navigator.getUserMedia = navigator.getUserMedia || 
          navigator.webkitGetUserMedia || 
           navigator.mozGetUserMedia || 
           navigator.msGetUserMedia; 

    var video = document.querySelector('video'); 
    var streamRecorder; 
    var webcamstream; 

    if (navigator.getUserMedia) { 
     navigator.getUserMedia({audio: true, video: true}, function(stream) { 
     video.src = window.URL.createObjectURL(stream); 
     webcamstream = stream; 
    // streamrecorder = webcamstream.record(); 
     }, onVideoFail); 
    } else { 
     alert ('failed'); 
    } 

    function startRecording() { 
     streamRecorder = webcamstream.record(); 
     setTimeout(stopRecording, 10000); 
    } 
    function stopRecording() { 
     streamRecorder.getRecordedData(postVideoToServer); 
    } 
    function postVideoToServer(videoblob) { 

     var data = {}; 
     data.video = videoblob; 
     data.metadata = 'test metadata'; 
     data.action = "upload_video"; 
     jQuery.post("http://www.kongraju.in/uploadvideo.php", data, onUploadSuccess); 
    } 
    function onUploadSuccess() { 
     alert ('video uploaded'); 
    } 

    </script> 

    <div id="webcamcontrols"> 
     <button class="recordbutton" onclick="startRecording();">RECORD</button> 
    </div> 

è possibile inviare file registrato al server.

Riferimenti:

http://www.w3.org/TR/mediastream-recording/

+0

sai che tipo il file video/pezzo è andato ha raggiunto la porzione 'data = {}' prima di essere inviato al server? – JerryFox

+2

Ottengo l'errore _Uncaught TypeError: Impossibile leggere la proprietà 'record' di undefined_ alla riga 41 'streamRecorder = webcamstream.record();' su Chrome versione 46.0.2490.86 m –

1

di chat video in duplex con più partecipanti è videoconferenze, per questo è necessario un componente server che mescola l'audio e il video dei partecipanti e le trasmissioni a loro. Hai davvero bisogno di un server multimediale per questo. Per WebRTC ce ne sono alcuni disponibili; guarda il server di telepresenza di Doubango: https://code.google.com/p/telepresence/

Mobicents ha un buon stack SIP per le stesse funzionalità, ma multi-media per webRTC sono limitate.

Altrimenti perché non iniziare a scriverne uno? :)

Problemi correlati