2014-06-18 2 views
2

J'essaie de diffuser la pièce jointe vidéo de CouchDB en utilisant nano middleware dans NodeJS. La vidéo est reçue sur le navigateur. Je ne sais pas comment je devrais le streamer sur le client et comment l'afficher en HTML Tag.Nodejs flux vidéo de CouchDB et afficher dans la balise vidéo

Voici mon code NodeJS pour lire l'attachement de CouchDB que je trouve de here:

if (req.headers.range) { 
    var stream = db.attachment.get(docid, docname, {Range: req.headers.range}); 
    stream.on('response', function(response) { 
     var start = req.headers.range.replace(/bytes=/, "").split("-")[0]; 
     var end = response.headers['content-length']; 
     res.writeHead(206, { 
      'ETag': response.headers.etag, 
      'Content-Range': 'bytes ' + start + "-" + (end - 1) + '/' + end, 
      'Accept-Ranges': 'bytes', 
      'Content-Length': end - start, 
      'Content-Type': response.headers['content-type'] 
     }); 
    }); 
} else { 
    stream = db.attachment.get(docid, docname); 
} 
stream.pipe(res); 
stream.on('end', function() { 
    res.end(); 
}); 

Sur le mon appel ajax ressemble côté client ceci:

jQuery.ajax({ 
     url: '/getvideoattachment/?id=' + this.id + "&name=" + videoname, 
     contentType: 'video/webm', 
     type: 'GET', 
     headers : { "Range" : 'bytes=0-3200' }, 
     processData : false, 
     success: function(content) { 
      var oMyBlob = new Blob([content], { "type" : "video\/webm" }); 
      var docURL = window.URL.createObjectURL(oMyBlob); 
      var elVideo = document.getElementById("videoid"); 
      elVideo.addEventListener("load", function (evt) { window.URL.revokeObjectURL(docURL); }); 
      elVideo.setAttribute("src", docURL); 
     }, 
     error : function(content) 
     { 
      Em.Logger.info('Model:', this.id, 'has no image', err); 
      return ''; 
     } 
    }); 

En balise HTML vidéo est comme ceci:

<video controls id="videoid" > 
        <source src="" type="video/webm" /> 
       </video> 

Je ne suis pas sûr si Blob est la bonne façon de stre suis la vidéo à la balise vidéo. Comment dois-je ajouter les flux à la balise vidéo?

Edit:

Vous avez raison brianchirls. Ça marche! J'ai mis l'URL de la vidéo. Mais ce que je reçois dans la balise vidéo est la suivante:

<video controls="" id="videoa" class="visible" data-bindattr-7="7"> 
        <source src="/getvideoattachment/?id=a26de29ded4e33ad47205187f4000f46&amp;name=c.webm" data-bindattr-8="8" type="video/webm"> 
       </video> 

Mais quand je clique sur le jeu, il ne joue pas la vidéo. Mais quand je clique sur le lien de l'élément d'inspection, il joue la vidéo dans la nouvelle fenêtre du navigateur.

Cette solution est presque là.

+2

Avez-vous essayé d'ignorer le bit ajax et de simplement définir le src de la vidéo sur cette même URL? Vous pouvez laisser le navigateur gérer la demande. – brianchirls

Répondre

0

@brianchirls réponse a aidé.

En changeant l'attribut src de la balise vidéo plutôt que la balise source a commencé le streaming vidéo.

Merci!