ドラッグアンドドロップでファイルをアップロードするライブラリ

Drag and Drop でファイルアップロードをする HTML5 File Upload^*1 というライブラリを見つけたのでメモ。

Creating a Complete HTML5 Drag and Drop File Uploader with jQuery | InsertHTML

Today we’re going to be creating a file uploader using HTML5 drag and drop, along with the file reader API and some PHP. We’ll also be using local storage to remember which files were uploaded by the user.

動作確認はデモページからできます。普段は Plupload を使っていて特に不便はしていないのですが、多機能な plupload に比べてこちらは比較的シンプルな実装なので、あまり機能がいらない場合にはこちらの方がすっきりとして見やすいかもしれません。アップロードしたファイルをハンドリングするためのPHPスクリプトもついているので、これをベースに開発すれば自作のPHPアプリに組み込むのも簡単ですね。

† 参考

　・ドラッグ&ドロップでイメージファイルをアップロードできる「HTML5 File Upload」 | DesignDevelop

• ^*1: Creating a Complete HTML5 Drag and Drop File Uploader with jQuery | InsertHTML