BLOB URLとはなにか？

参考

src=”blob:https://example.com.video”とかってなに？

Blob URLは、ブラウザによって内部でのみ生成できます。 URL.createObjectURL（）は、URL.revokeObjectURL（）を使用して後で解放できるBlobまたはFileオブジェクトへの特別な参照を作成します。これらのURLは、ブラウザの単一インスタンスおよび同じセッション（つまり、ページ/ドキュメントの寿命）でのみローカルで使用できます。

BLOB URLとは何ですか？

なぜ使用されるのですか？

Blob URL /OBJECT URLは、画像、バイナリデータのダウンロードリンクなどのURLソースとしてBlobおよびFileオブジェクトを使用できるようにするための擬似プロトコルです。

たとえば、Imageオブジェクトの生のバイトデータは、それをどう処理するかわからないため、渡すことはできません。たとえば、URLを介して読み込まれる画像（バイナリデータ）が必要です。これは、ソースとしてURLを必要とするものすべてに適用されます。バイナリデータをアップロードしてURL経由で提供する代わりに、サーバーを経由せずにデータに直接アクセスできるように、追加のローカルステップを使用することをお勧めします。

また、Base-64としてエンコードされた文字列であるData-URIの代替としても適しています。 Data-URIの問題は、JavaScriptで各文字が2バイトを使用することです。さらに、Base-64エンコードにより33％が追加されます。ブロブは純粋なバイナリバイト配列であり、Data-URIのように大きなオーバーヘッドがないため、処理が高速化および小型化されます。

サーバー上で独自のBLOB URLを作成できますか？

いいえ、Blob URL / Object URLは、ブラウザの内部でのみ作成できます。 BLOBを作成し、File Reader APIを介してFileオブジェクトを取得できますが、BLOBは単なるバイナリラージOBjectを意味し、バイト配列として格納されます。クライアントは、ArrayBufferまたはBlobとして送信されるデータを要求できます。サーバーは、データを純粋なバイナリデータとして送信する必要があります。データベースはしばしばBlobを使用してバイナリオブジェクトも記述しますが、基本的には基本的にバイト配列について説明しています。

さらに

バイナリデータをBLOBオブジェクトとしてカプセル化し、URL.createObjectURL（）を使用してローカルURLを生成する必要があります。

var blob = new Blob（[arrayBufferWithPNG]、{type： "image / png"}）、
    url = URL.createObjectURL（blob）、
    img = new Image（）;

img.onload = function（）{
    URL.revokeObjectURL（this.src）; //メモリをクリーンアップします
    document.body.appendChild（this）; //画像をDOMに追加します
}

img.src = url; //バイトを「ストリーミング」できるようになりました

URLにはwebkit-browsersでプレフィックスが付けられる場合があるため、次を使用します。

var url =（URL || webkitURL）.createObjectURL（…）;

参考

https://stackoverflow.com/questions/30864573/what-is-a-blob-url-and-why-it-is-used