如何在 Ionic 3 中访问 sdcard 文件答案

【问题标题】：How to access sdcard files in Ionic 3如何在 Ionic 3 中访问 sdcard 文件
【发布时间】：2017-11-13 04:59:30
【问题描述】：

我正在开发 Ionic 3，我是 ionic 的新手，所以尝试从我使用的设备上传文档，并获得 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));
}

【问题讨论】：

您有任何控制台错误吗？
没有没有任何错误..

标签： android angular typescript cordova-plugins ionic3

【解决方案1】：

您可以使用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。

【讨论】：

您好，感谢您的回复，我有读取文件的代码，但无法访问文件。我可以授予存储权限，但仍然无法访问 sdcard 文件。
你能显示那个代码吗？你没有展示别的东西吗？
上面的代码是我授予用户权限的地方，下面是我访问文件的地方： 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; //这里在 navtivepath 我得到文件路径 }) .catch(err => alert("文件路径 "+err)); }

【解决方案2】：

这可能会有所帮助：

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 卡。

【讨论】：