a[download] と Blob で任意のファイルを作ってダウンロードさせる
これを JSON ファイルとして保存したい
{ hoge: 1, fuga: 2, piyo: 3 }
インターフェース
<a href="#" class="download disabled">ダウンロード</a>
1. Blob(*) を使ってバイナリデータを作る
var a = document.querySelector('.download'); var obj = { hoge: 1, fuga: 2 , piyo: 3 }; var blob = new Blob( [JSON.stringify(obj)], { type: 'application\/json' } );
2. blob を元に URL.createObjectURL で URL を作る
var url = URL.createObjectURL(blob);
3. A要素からダウンロードできるように属性値をセット
a.href = 'data.json'; a.download = url; a.classList.remove('disabled');
Code
var a = document.querySelector('.download'); var obj = { hoge: 1, fuga: 2 , piyo: 3 }; var blob = new Blob( [JSON.stringify(obj)], { type: 'application\/json' } ); var url = URL.createObjectURL(blob); a.download = 'data.json'; a.href = url; a.classList.remove('disabled');
Demo
使えるブラウザは Can I use... とか参照してください。
今だと Chrome と Firefox だけかな
後でもうちょっと詳しいことも書くか。。
BLOBとは何か