如何在Ionic 3中访问SD卡文件

时间:2017-09-11 10:53:14

标签: android angular typescript cordova-plugins ionic3

我正在研究Ionic 3,我是离子的新手,所以试图从我使用的设备上传文件和Android存储访问权限,但我只能访问设备的内部存储,我想从SD卡访问文件。 以下是我的代码

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { RemoteServiceProvider} from "../../providers/remote-service/remote-service";
import { AndroidPermissions } from '@ionic-native/android-permissions';

@IonicPage()
@Component({
 selector: 'page-home',
 templateUrl: 'home.html',
 })
export class HomePage {

 android: AndroidPermissions;
 constructor(public remoteServiceProvider: RemoteServiceProvider, public 
 navParams: NavParams, public nvCtr: NavController) {
//this.getStates();
this.android= new AndroidPermissions();
this.android.requestPermissions([this.android.PERMISSION.READ_EXTERNAL_STORAGE,this.android.PERMISSION.WRITE_EXTERNAL_STORAGE])


  }

  getStates(){
this.remoteServiceProvider.getResult().subscribe(data => {
  alert(data._body);
},error => {
  alert(error);
});

 }
 ionViewDidLoad() {
  console.log('ionViewDidLoad HomePage');

 }

}

以上代码是我从用户授予权限的位置,以及我访问文件的位置:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { FileChooser } from '@ionic-native/file-chooser';
import { FilePath } from '@ionic-native/file-path';
import { File } from '@ionic-native/file';
import {Platform} from "ionic-angular";
@IonicPage()
@Component({
 selector: 'page-document',
  templateUrl: 'document.html',
})

export class DocumentPage {
fileChooser: FileChooser;
filePath: FilePath;
nativepath: any;
file: File;

constructor(public navCtrl: NavController, public navParams: NavParams) {
this.fileChooser= new FileChooser();
this.filePath= new FilePath();
this.file=new File();
}

ionViewDidLoad() {
  console.log('ionViewDidLoad DocumentPage');
}

openFile(){
this.fileChooser.open()
.then(uri => this.convertFilePath(uri))
.catch(e => alert(e));
}

convertFilePath(filePathUri: string){
this.filePath.resolveNativePath(filePathUri)
.then(filePath =>{
  this.nativepath= filePath;
  //Here in nativepath we get filepath
})
.catch(err => alert("filePath "+err));
}

}

以上代码是我从用户授予权限的位置,以及我访问文件的位置:

openFile(){
   this.fileChooser.open()
   .then(uri => this.convertFilePath(uri))
   .catch(e => alert(e));
}

convertFilePath(filePathUri: string){
 this.filePath.resolveNativePath(filePathUri)
 .then(filePath =>{
  this.nativepath= filePath;
  //Here in navtivepath i get the file path
 })
 .catch(err => alert("filePath "+err));
}

2 个答案:

答案 0 :(得分:0)

您可以使用Native plugin file轻松完成此操作。

  

此插件实现了一个文件API,允许对文件进行读/写访问   住在设备上。

     

File类实现静态便捷函数来访问文件   和目录。

 ionic cordova plugin add cordova-plugin-file
 npm install --save @ionic-native/file

您需要在Android上使用externalRootDirectory实例成员。

  

Android:外部存储(SD卡)根目录。

Git repo here

答案 1 :(得分:0)

这可能有所帮助:

import { File } from "@ionic-native/file";
import { Diagnostic } from "@ionic-native/diagnostic";

constructor(
    ...
    public file: File,
    public diagnostic: Diagnostic
){

this.diagnostic.getExternalSdCardDetails()
.then( (data) => {
  this.jcError += "\n" + "sd:" + JSON.stringify( data);
  this.jcError += "\n" + "Number cards: " + data.length;
  for( let ii = 0; ii < data.length; ii += 1){
    let thisElem = data[ii];
    if( thisElem.type.toLowerCase() === "application" && thisElem.canWrite){
      this.ourSDentry = thisElem;
      basePathSD = thisElem.filePath;
      break;
    }
  }
  if( !basePathSD){
    this.jcError += "\n\n" + "no SD card found";
    return;
  }
}, (errData)=>{
  tag = "getExternalSdCardDetails";
  this.jcError += "\n\n" + tag + ":ERR:" + JSON.stringify( errData);
});

然后,您可以使用basePathSD访问SD卡。