クライアントサイドだけでファイルを保存する「FileSaver.js」
FileSaver.jsはクライアントサイドでデータを生成しダウンロードするJavaScriptライブラリです。
Webアプリケーションが増える中、Webブラウザ上で作ったコンテンツをそのままエクスポートする時に使えるライブラリがFileSaver.jsです。
まず画像を保存するデモです。
こんな感じに適当にマウスで文字を書きます。
ファイル名をつけて保存ボタンを押すと保存が実行されます（ウィンドウ下部にダウンロードファイルがあります）。
ダウンロードされたファイルです。内容が動的に生成されているのが分かります。
同様にテキストの保存もできます。
テキストファイルの内容も動的です。UTF-8で作成されます。
HTMLファイルの保存もできます。
FileSaver.jsはコンテンツをCanvasタグにレンダリングし、それをダウンロードしているようです。HTML5対応ブラウザに限定されますが、クライアントベースでエクスポート機能が実装できるのは便利そうです。
FileSaver.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。
MOONGIFTはこう見る
画像などは扱う機会はそれほど多くないかも知れませんが、テキストファイルの出力は例えばCSVとしてダウンロードさせるような仕組みや、WYSIWYGエディタで描いた内容をHTMLとしてダウンロードさせるといった時に活躍するかも知れません。サーバサイドを使わないのでオフライン時でも使えるのが魅力です。
サーバサイドに頼らない技術が広がれば一旦読み込んでしまったりオフライン設定をしておけば、ネットワークにつながっていなくとも各種Webアプリケーションが使えるようになります。Webブラウザの活動範囲を広げるためにもこうした技術は発展してほしいものになります。