html5 (youtube) видео-тег описание

Question

Мне нужно разместить несколько видео на моем сайте. Я смотрел, как это делает YouTube, но я не понимаю источник видео. Ниже приведен видеотег в youtube. Источник - это блоб, почему? Что означает URL? Как это работает? Как я могу сделать то же самое?

<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> 

Заранее спасибо.

Answer 1

YouTube использовать MediaSource Extensions (MSE) в Firefox Пульт SRC будет выглядеть как "MediaSource: https://www.youtube.com/9effef84-87ae-43c0-abae-8005d399e1fd" Для использования MediaSource вам нужно conwert видео в формате MPEG-тире. Это означает, что видео будет разбито на несколько файлов. Один из них (файл метаданных .mp4) будет содержать атомы moov и другие (.m4s) moof и атомы MDAT. Вы можете добиться этого с помощью ffmpeg и загрузить его в браузере с помощью xmlhttprequest или webSocket. Вы также можете использовать Blob небольшой пример:

\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();