Comment soumettre/streame de la vidéo depuis un navigateur vers un serveur?

Question

Je peux enregistrer une vidéo en utilisant getUserMedia() dans un navigateur. Cependant, je n'ai pas trouvé de moyen pratique pour soumettre (enregistrée) ou diffuser (en direct) une vidéo du navigateur vers un serveur.

La seule chose que j'ai trouvée est de rendre la vidéo sur un canvas, puis de soumettre ou diffuser les images rendues, par exemple en utilisant des URI de données. (Ce qui n'est pas efficace.)

Existe-t-il un meilleur moyen? (Par exemple, diffuser directement les données binaires ou les stocker dans un fichier puis envoyer ce fichier.)

MISE À JOUR : J'ai trouvé une question similaire ancienne : Stream getUserMedia to an Icecast server?

Answer 1

MediaStreamRecorder est une API WebRTC pour enregistrer des flux getUserMedia(). Il permet aux applications web de créer un fichier à partir d'une session audio/vidéo en direct.

    function onVideoFail(e) {
        console.log('échec de la webcam!', e);
      };

    function hasGetUserMedia() {
      // Note: Opera est unpréfixé.
      return !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||
                navigator.mozGetUserMedia || navigator.msGetUserMedia);
    }

    if (hasGetUserMedia()) {
      // Bon pour aller!
    } else {
      alert('getUserMedia() n'est pas pris en charge dans votre navigateur');
    }

    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 ('échec');
    }

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

        var data = {};
        data.video = videoblob;
        data.metadata = 'métadonnées de test';
        data.action = "upload_video";
        jQuery.post("http://www.foundthru.co.uk/uploadvideo.php", data, onUploadSuccess);
    }
    function onUploadSuccess() {
        alert ('vidéo téléchargée');
    }

        ENREGISTRER

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

vous pouvez envoyer le fichier enregistré sur le serveur.

Answer 2

Il ne fait pas encore partie de n'importe quel navigateur, mais sortira bientôt au moins dans Chrome. Vérifiez http://code.google.com/p/chromium/issues/detail?id=113676