ゆったりWeb手帳

Blobエラーで困った

Blobを使うとChromeがエラーになる

5MB程度のファイルをBlobを使ってChromeからファイルとして出力しようと思ったが、Chromeがクラッシュしてしまい、うまくいかない。

blob-chrome-error blob-dev-error

というか小さなサイズのファイルでも正しい形式にならない。

データをUint8Array型からファイルに変換するときの失敗例

JavaScript
const data = new Uint8Array(fileObject)
const blob = new Blob(data, {type: 'text/plain'})

配列でないとダメ

Uint8Array型は配列だと思ってたのですが、さらに配列に入れてやらないとダメらしい。

[]で囲むだけでうまくいきました。

JavaScript
const blob = new Blob([data], {type: 'text/plain'})

ファイルのダウンロード

ちなみに、これをブラウザからダウンロードさせるときは、以下のようにして、URLを作成します。

JavaScript
const url = window.URL.createObjectURL(blob)

これを<a>タグのhrefに指定してあげればOK。

ていうかよく見たらMDNにちゃんと書いてあった。

Blob | MDN