ITエンジニア/デザイナ向けにオープンソースを毎日紹介

アップロード途中で止まると相当なストレスですよね。そこで使ってみたいライブラリです。

HTML5を使うとファイルをドラッグ&ドロップでアップロードできるようになってとても便利になっています。しかしごく小さなファイルのアップロードであればまだしも、巨大なファイルをアップロードするとなるとまだ大きな問題が残っています。それがネットワークエラーです。

Webではファイルを一括でアップロードしますので、途中でエラーが起きるとまた最初からやり直しになってしまいます。これはクライアント/サーバ双方に負荷がかかる仕組みです。これを改善できるのがResumable.js、リジューム対応のファイルアップローダーです。

サンプルのnodeアプリケーションで実験します。
サンプルのnodeアプリケーションで実験します。

900MBくらいのファイルをアップロードします。
900MBくらいのファイルをアップロードします。

右側にある一時停止ボタンを押すとアップロードが停止します。
右側にある一時停止ボタンを押すとアップロードが停止します。

いつでも再開が可能です。
いつでも再開が可能です。

この仕組みを可能にしているのはHTML5のFile APIです。ファイルを細かく読み込んで、それをアップロードしています。ネットワーク状態を見るとそれがよく分かります。

ネットワークタブ
ネットワークタブ

細かくデータを分けてアップロードしていますのでネットワークコネクションの数は相当に増えると思われます。ただし巨大なファイルをアップロードする際などのように独占してしまうことがないので、複数人が随時ファイルをアップロードすると言った仕組みが実現できるはずです。

バックエンドはPHPやRuby on Rails、Java向けの解説がされています。細切れのファイルをトークンに沿ってくっつけて処理する仕様さえ分かればサーバサイドの言語は問わずに使えるでしょう。

巨大なファイルほどアップロードに失敗すればユーザストレスは大きいものになります。動画や写真、サイズの大きいファイルを共有サイトで使ってみたいソフトウェアです。

Resumable.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

Resumable.js, JavaScript magic for simultaneous, stable and resumable uploads

23/resumable.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2