blobを使用してYouTube/Facebookに動画を表示するにはどうすればよいですか？

Question

私はこれらのウェブサイトがサーバーからブロブ形式のビデオを入手するために使用するプロセスを知りたいですか？

<video height="390" width="693" preload="auto" src="blob:https://www.facebook.com/34799f7c-34d4-48c7-976f-1e2ddba0728a"></video> 

私のサイトで同じ方法を実装しようとしています。

ブロブを使用してビデオをソースすることができます。しかし、最初にサーバーからビデオを取得（ダウンロード）してから、ブロブを作成する必要があるので、プロセスは遅いです。

var xhr = new XMLHttpRequest(); 
xhr.open("GET", "video.mp4"); 
xhr.responseType = "blob"; 
xhr.onload = function() 
{ 
    var video = document.getElementById("videoId"); 
    video.src = URL.createObjectURL(xhr.response); 
} 
xhr.send(); 

ビデオの長さが10分の場合、ビデオソースを更新するためにページが読み込まれてから約15秒かかります。

しかし、YouTubeなどで動画を見ると、ほとんど瞬時に読み込まれます。 BLOBを使用してビデオをすばやく読み込む方法

Answer 1

YouTubeはMediaSourceの拡張機能を使用して、ビデオの再生をきめ細かく制御します。しかし、それはおそらくほとんどのユーザーよりも洗練されたものです。 .MP4ファイルを再生するための最も簡単な方法は次のとおりです。

var video = document.getElementById("videoId"); 
video.src = "video.mp4"; 

これは、ユーザーがYouTubeがどのように機能するかに似て、時計だけで何をダウンロードします。