大容量のアップロード、ダウンロードについて

どうだ！？、これで大容量のアップロードも可能になります。

って事で、今回は大容量のアップロードを可能にする方法を考えてみました。
JQueryを利用するとコーディングが取っても楽になるのですが、業務シーンにより利用できないケースもあるので、pure Javascriptで作成しました。

さて利用に当たってですが、以下の条件があります。

1. HTML5 File APIを利用しているので、動作可能なブラウザのバージョンに制限があります。
2. 一応SafariやIEも考慮していますが、動作確認を行ったのはChromeです。私の端末はvistaなので、IE9までしかなくて、HTML5に非対応なので、動作確認できていません。
3. サーバ側のアプリケーションサーバはwildfly9.0で実装しました。

こんな雰囲気で作成しています。

• FileAPIのsliceによりファイルを一定のサイズで分割
• 分割したファイルをXMLHttpRequestにより、Ajaxによりサーバへ送信
• サーバ側で受信したファイルを追記モードでファイルに書き出し

といった感じです。

まだまだ、異常系の考慮についてはこれからですが、ひとまず巨大なファイルを分割してアップロードすることにより理論的にはアップロードするファイルの大きさに対する制限はなくなります。

また、今回のスクリプトは順次アップロードする仕組みにしておりますので、サーバへの負荷も比較的低く抑えることができるかと思います。

JavaScript

入力用画面サンプル

サーバ側のサンプル

最後に

今回はmultipart form-data形式でアップロードにチャレンジしてみましたが、アップロードするファイルのサイズを大きくするにつれてXMLHttpRequest.send(form)で実際にサーバへ送信されるまでの時間がかかっている印象がありました。恐らく、formデータを送信するための電文に変換する処理に時間がかかっている印象です。
XMLHttpRequest.send()を調べてみると、どうやらblobも送信できそうな記述が見つかったので、次はformデータではなくバイナリをそのまま送信してみるとこのあたりのオーバーヘッドが減るかもしれません。
今回は実測値はないので、もう少しがんばって、更新していきたいと思います。

課題

• 途中で失敗した際のファイルの後片付けとかはどうする？（一定時間応答が無ければ捨てるような仕組みでいけないかな．．．）
• ロードバランサ等による振り分けには耐えられない（共有ディスクを使ってなんとかかんとかすると出来るかも）