URLに問題がありますblob
。
src
YouTube でタグを検索していたところ、次のようなvideo
ビデオを見つけました:src
src="blob:https://video_url"
blob
動画内の URLを開いたのですsrc
が、エラーが発生しました。リンクは開けませんが、src
タグは機能していました。どうしてこんなことが起こるのでしょうか?
いくつかの質問を聞きたいんです:
- URLとは何ですか
blob
? - なぜ使用されるのですか?
blob
サーバー上に独自の URL を作成できますか?
URLに関する追加の詳細もblob
役立ちます。
ベストアンサー1
BLOB URL(参照ウィキペディア、正式名称) またはオブジェクト URL (ref.翻訳およびメソッド名)は、ブロブまたはファイル物体。
blob
動画内の URLを開いたのですsrc
が、エラーが発生しました。リンクは開けませんが、src
タグは機能していました。どうしてこんなことが起こるのでしょうか?
BLOB URL はブラウザによって内部的にのみ生成されます。URL.createObjectURL()
BlobまたはFileオブジェクトへの特別な参照を作成し、後で次のように解放することができます。URL.revokeObjectURL()
これらの URL は、ブラウザの単一のインスタンス内、および同じセッション内 (つまり、ページ/ドキュメントの有効期間内) でのみローカルに使用できます。
URLとは何ですか
blob
? なぜ使用されるのですか?
Blob URL/Object URL は、Blob および File オブジェクトを画像、バイナリ データのダウンロード リンクなどの URL ソースとして使用できるようにする疑似プロトコルです。
たとえば、Image オブジェクトに生のバイトデータを渡すことはできません。そのデータをどう処理すればよいか分からないからです。たとえば、画像 (バイナリ データ) は URL 経由で読み込む必要があります。これは、ソースとして URL を必要とするすべてのものに当てはまります。バイナリ データをアップロードして URL 経由で返すのではなく、サーバーを経由せずにデータに直接アクセスできるように、追加のローカル ステップを使用する方が適切です。
これは、次のようにエンコードされた文字列であるData-URIのより良い代替手段でもあります。ベース64Data-URI の問題は、JavaScript では各文字が 2 バイトを占めることです。さらに、Base-64 エンコードにより 33% が追加されます。BLOB は純粋なバイナリ バイト配列であり、Data-URI のような大きなオーバーヘッドがないため、処理が高速で小さくなります。
blob
サーバー上に独自の URL を作成できますか?
いいえ、Blob URL/Object URL はブラウザ内部でのみ作成できます。Blob を作成し、File Reader API を介して File オブジェクトを取得できますが、BLOB は Binary Large OBject を意味し、バイト配列として保存されます。クライアントは、データを ArrayBuffer または Blob として送信するように要求できます。サーバーは、データを純粋なバイナリ データとして送信する必要があります。データベースは、バイナリ オブジェクトを記述するために Blob を使用することが多いため、基本的にはバイト配列について説明しています。
URLに関する追加の詳細も
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); // clean-up memory
document.body.appendChild(this); // add image to DOM
}
img.src = url; // can now "stream" the bytes