【Ionic3】AndroidのDownloadフォルダにファイルを保存する
Androidアプリ内でなにかしらのファイルをダウンロードした際には、一般的にAndroidの内部ストレージのDownloadに保存されます。
Ionic3ではNative Pluginを使うと実現することができます。
Fileプラグインと、File Transferプラグインでファイルのダウンロードを行いますので、プラグインをインストールします。
プラグインのインストール
Fileプラグイン
$ ionic cordova plugin add cordova-plugin-file $ npm install --save @ionic-native/file引用元: Ionic Docs File
File Transferプラグイン
$ ionic cordova plugin add cordova-plugin-file-transfer $ npm install --save @ionic-native/file-transfer引用元: Ionic Docs File Transfer
また、AndroidのDownloadフォルダは、各アプリ固有の領域ではなく、ルートディレクトリなので、アクセスするためにはユーザーの許可が必要です。
アクセス許可を得るためにも、プラグインを必要ですので、Android Permissionsプラグインをインストールします。
Android Permissionsプラグイン
$ ionic cordova plugin add cordova-plugin-android-permissions $ npm install --save @ionic-native/android-permissions引用元: Ionic Docs Android Permissions
これで必要なものは揃いました。あとはコードを書くだけです。
プラグインの使い方
Viewのコード
<!-- home.html --> <ion-content padding> <button ion-button primary (click)="download()" tappable>ダウンロード</button> </ion-content>
Componentのコード
// home.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { AndroidPermissions } from '@ionic-native/android-permissions';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor
(
public navCtrl: NavController,
private transfer: FileTransferObject,
private file: File,
private androidPermissions: AndroidPermissions,
) {}
download() {
// アクセス許可を求める
this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.WRITE_EXTERNAL_STORAGE)
.then(status => {
console.log('Has permission?',status.hasPermission);
// ダウンロード処理
const url = 'https://www.example/sample.pdf';
this.transfer.download(url, this.file.externalRootDirectory + 'Download/download_test.pdf')
.then(() => console.log('download complete'))
.catch((e) => console.error('download error:', e));
})
.catch(err => this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.WRITE_EXTERNAL_STORAGE));
}
}
今回は横着して、ダウンロード元のURLは固定で、保存する時のファイル名も固定にしています。
ダウンロードボタンをタップすると、WEB上のsample.pdfをダウンロードし、download_test.pdfという名前で保存する、という流れです。
this.androidPermissions.PERMISSION.WRITE_EXTERNAL_STORAGE の部分が外部ストレージへの書き込み許可を扱います。
因みに、WRITE_EXTERNAL_STORAGE以外にもパーミッションは多くありますので詳しくはAndroidのドキュメントを参照してください。
this.file.externalRootDirectoryがファイルを保存する場所を指定しています。
externalRootDirectoryは「外部ストレージ（SDカード）のルート」とIonicのドキュメントでは説明されていますが、実際は内部ストレージのルートにあるsdcardというディレクトリのことを指しています。
なぜFileプラグイン（cordova-plugin-file）は「取り外し可能な方のSDカード」ではなく、内部ストレージの位置を返却するのかというと、「取り外し可能な方のSDカード」は全てのハードウェアでサポートされているわけではないからです。
内部ストレージであれば、すべてのAndroidハードウェアに存在するため、externalRootDirectoryが返却する位置は内部ストレージのsdcardディレクトリを返すようになっています。
