JavaScript を使用して BLOB を表示する

Question

データベースから Blob 画像を取得していますが、JavaScript を使用して画像を表示できるようにしたいと考えています。次のコードは、ページ上に壊れた画像アイコンを生成します。

var image = document.createElement('image');
    image.src = 'data:image/bmp;base64,' Base64.encode(blob);
    document.body.appendChild(image);

これは、BLOB を含む必要なすべてのコードを含む jsFiddle です。完成したコードでは画像が正しく表示されるはずです。

Answer 1

XMLHttpRequest から直接 BLOB オブジェクトを取得することもできます。 responseType を blob に設定するだけです。これは私のコードです:

リーリー

応答関数は次のとおりです:

リーリー

HTML で空の画像要素を作成するだけです:

リーリー

Answer 2

問題は、Base64 エンコードの前にバイナリに変換する必要がある 16 進データがあることです。

PHP の場合:

リーリー