2016-11-08 2 views
0

Je dois héberger quelques vidéos sur mon site Web. Je regardais comment youtube le fait, mais je ne comprends pas la source vidéo. Voici la balise vidéo sur youtube. La source est un blob, pourquoi? Que signifie l'URL? Comment ça marche? Comment puis-je faire la même chose?html5 (youtube) explication de la balise vidéo

<div class="html5-video-container" data-layer="0"> 
    <video tabindex="-1" class="video-stream html5-main-video" 
    style="width: 640px; height: 360px; left: 0px; top: 0px; opacity: 1;" 
    src="blob:https://www.youtube.com/9effef84-87ae-43c0-abae-8005d399e1fd"> 
    </video> 
</div> 

Merci d'avance.

Répondre

0

utiliser YouTube MediaSource Extensions (MSE) dans Firefox le src sera ressembler à "MediaSource: https://www.youtube.com/9effef84-87ae-43c0-abae-8005d399e1fd" Pour utiliser MediaSource vous avez besoin Conwert votre vidéo au format mpeg tableau de bord. Cela signifie que la vidéo sera divisée en plusieurs fichiers. L'un d'entre eux (fichier de métadonnées .mp4) contiendra l'atome moov et d'autres (mo4s) moof et les atomes MDAT. Vous pouvez réaliser ceci avec ffmpeg et le télécharger dans le navigateur en utilisant xmlhttprequest ou webSocket. Vous pouvez également utiliser le Blob est un petit exemple:

\t xhr.open('GET', "http://localhost:1313/1.mp4", true); 
 
\t xhr.responseType = 'arraybuffer'; 
 
\t xhr.onload = function(){ 
 
\t \t file = new Blob([ new Uint8Array(xhr.response) ], {type: 'video/mp4'}); 
 
\t \t document.querySelector("video").src = URL.createObjectURL(file); 
 
\t \t } 
 
\t xhr.send();