HTML5で便利になったAPIの一つがファイルの読み込み、FileReaderではないでしょうか。しかし非同期処理で行うものが多く、実装が若干面倒なイメージがあります。さらにこのデータを扱うのはファイルボックスまたはファイルのドラッグ&ドロップと二種類あるのも面倒です。 そこで使ってみたいのがFileReader.jsです。ファイルに加えてクリップボードまで共通のインタフェースで扱えるようになります。 FileReader.jsの使い方 FileReader.jsのデモです。ファイルボックス、ドラッグ&ドロップ、クリップボードを扱えます。 デモ画面 例えばファイルをドロップするUIの場合。データの受け取り型を指定しておけば、後はファイルが送られてくる仕様です。 FileReaderJS.setupDrop(document.body, { readAsDefault: "DataURL",