ただし、AngularJSについても、よく知りたいという方は筆者の連載もありますので、そちらをご参照していただけると幸いです。
対象読者
- スマホアプリに挑戦したいと思っているWEB開発者
- アプリ開発をもっと楽にしたいと思っている方
- 業務スマホアプリを作る開発者
ファイルのダウンロードとアップロードプラグイン
ネットワーク上のファイルのダウンロードとアップロードを行うプラグインを紹介します。
ダウンロードはアプリの初期データには含めず、後でデータを提供したい場合などにも利用でき、オフライン時のためなどにローカルファイルに保存しておくことなどができます。
また、カメラから取った画像やビデオファイルなど端末内にあるファイルをアップロードしたい場合もあるでしょう。これらはAJAXを使ってのダウンロード、もしくはアップロードも可能ですが、もっと簡単に行うプラグインがありますので紹介します。
インストール
インストールするプラグインは、「cordova-plugin-file-transfer」です。インストールはリスト1のように行います。
$cordova plugin add cordova-plugin-file-transfer
プラグインで用意されるクラス(コンストラクタ)
このプラグインを導入すると、表1のようなクラス(コンストラクタ)が追加されます。ただし、devicereadyイベントが発火された以降でしか利用できない点は忘れないようにして下さい。
名称 | 説明 |
---|---|
FileTransfer | ファイルのアップロード、もしくはダウンロードを行うためのオブジェクトを作成する |
FileUploadOptions | ファイルをアップロードするときにファイル名やその他ヘッダなどを指定するためのオプションを作成する |
FileUploadResult | ファイルのアップロードに成功した際のコールバック関数に設定されるオブジェクト |
FileTransferError | アップロードもしくはダウンロードに失敗した際のコールバック関数に設定されるオブジェクト |
ファイルのアップロードもしくはダウンロードするために利用するFileTransferオブジェクトは、表2に示すプロパティもしくはメソッドがあります。
プロパティ、メソッド | 説明 |
---|---|
onprogress | アップロードもしくはダウンロード中の状況を把握するためのイベントメソッド |
upload() | ファイルのアップロードメソッド |
download() | ファイルのダウンロードメソッド |
abort() | ファイルのアップロードもしくはダウンロードの中断処理 |
また、アップロードもしくはダウンロード処理で失敗した場合にはFileTransferErrorオブジェクトが取得できます。FileTransferErrorオブジェクトには表3に示すプロパティがあります。
プロパティ | 説明 |
---|---|
code | エラーの原因を示すコード(数値)。表4に示すエラー一覧 |
source | アップロード元のURLもしくは、ダウンロード元となるURL |
target | アップロード先のURLもしくは、ダウンロード先となるURL |
http_status | エラーとなったときのHTTPのステータスコード。例)404 |
exception | エラーオブジェクト(getMessage()もしくはtoString()でメッセージを取得) |
エラーコードは数値で定義されていますが、表4に示す定数がありますので、そちらを利用して原因を判定してください。
値 | 定数 | 説明 |
---|---|---|
1 | FileTransferError.FILE_NOT_FOUND_ERR | ファイルが見つからない |
2 | FileTransferError.INVALID_URL_ERR | URLが不正の場合 |
3 | FileTransferError.CONNECTION_ERR | 接続エラー |
4 | FileTransferError.ABORT_ERR | 処理が中断された |
5 | FileTransferError.NOT_MODIFIED_ERR | HTTPでNot Modifiedによるコンテンツがなかった場合 |