使用file cordova插件用ionic扫描媒体文件

Question

我正在使用Ionic构建一个音乐播放器应用程序，那么我如何使用file cordova插件从文件存储中扫描音乐文件，以便用户可以选择要播放的歌曲。

Answer 1

您需要访问音乐文件并播放它们。有一些Cordova插件，应该有助于访问本地的东西。在您的项目中添加一个或多个插件后，我发现它们在github仓库中有非常有用的文档和示例。在npm页面中有一个链接。

访问文件有

• cordova-plugin-file: https://www.npmjs.com/package/cordova-plugin-file
• cordova-plugin-iospicker: https://www.npmjs.com/package/cordova-plugin-iosaudiopicker
• cordova-plugin-mediapicker: https://github.com/an-rahulpandey/cordova-plugin-mediapicker

根据您的目标设备类型，以及您希望用户访问媒体文件的位置，您可能需要使用其中一个或所有这些。

播放文件:

• cordova-plugin-media: https://www.npmjs.com/package/cordova-plugin-media
• cordova-plugin-streaming-media(如果你使用的是流音频的API): https://www.npmjs.com/package/cordova-plugin-streaming-media
• 你也可以使用HTML5媒体:https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_HTML5_audio_and_video

Answer 2

这段代码将列出所有文件夹和文件:

    import { File } from "@ionic-native/file";
    import { Diagnostic } from "@ionic-native/diagnostic";
    constructor(
        ...
        public file: File,
        public diagnostic: Diagnostic
        ){

  // -------------------------
  listFileSys( which){
    // <which> chooses the file system - see switch below
    this.jcDebug += "n" + "listFileSysSKOFLO(" + which + ")";
    let fileSysArray = [];
    let basePath = "";
    let tag = "unknown";
    // ************** RECURSE *************
    let jcListDir = (thisDir)=>{
      tag = "jcListDir: [" + thisDir + "]";
      this.file.listDir(basePath, thisDir)
      .then( (data)=>{
        tag = "listDir:" + thisDir;
        this.jcError += "n" + tag + ":" + JSON.stringify( data);
        for( let ii = 0; ii < data.length; ii += 1){
          this.jcError += "n" + data[ii].name + (data[ii].isDirectory? " [D]" : " [F]");
          let currentPath = thisDir;
          currentPath += (currentPath.length ? "/" : "");
          currentPath += data[ii].name;
          this.jcError += "n" + "currentPath:" + currentPath;
          fileSysArray.push( currentPath);
          if( data[ii].isDirectory && ok2recurse){
            jcListDir( currentPath);         // RECURSE !!!
          }
        }
      }, (errData)=>{
        tag = "listDir";
        this.jcError += "n" + tag + ":ERR:" + JSON.stringify( errData);
      });
    };
    // ************** RECURSE *************
    // ***********************
    let runListDir = ()=>{
        this.jcDebug += "n" + "basePath:" + basePath;
        // !!! START listing from basePath !!!
        jcListDir( ".");
    }
    // ***********************
    switch( which)
    {
      case 1:
        this.diagnostic.getExternalSdCardDetails()
        .then( (data) => {
          this.jcDebug += "n" + "sd:" + JSON.stringify( data);
          this.jcDebug += "n" + "Number of cards: " + data.length;
          for( let ii = 0; ii < data.length; ii += 1){
            let thisElem = data[ii];
            if( thisElem.type.toLowerCase() === "application" && thisElem.canWrite){
              basePath = thisElem.filePath;
              break;
            }
          }
          if( !basePath){
            this.jcDebug += "n" + "no SD card found";
            return;
          }
          runListDir();
        }, (errData)=>{
          tag = "getExternalSdCardDetails";
          this.jcError += "n" + tag + ":ERR:" + JSON.stringify( errData);
        });
      break;
      case 2:
        basePath = this.file.externalDataDirectory;
        this.jcError += "n" + "externalDataDirectory:" + basePath;
        runListDir();
        break;
      case 3:
        basePath = this.file.dataDirectory;
        this.jcError += "n" + "dataDirectory:";
        runListDir();
        break;
      default:
        alert( "which???:" + which);
        return;
    }
    // wait for all to comnplete, then show
    // assume 1000 ms is adequate delay per promise
    let lastFileSysLen = -1
    let checkCount = 30; // max 30 * 1000 ms = 30 seconds
    // ************** RECURSE *************
      let checkComplete = () => {
      this.jcDebug += "n" + "checkComplete " + checkCount + " [" + fileSysArray.length + "]";
      setTimeout( ()=>{
        // fileSysArr length stable?
        if( fileSysArray.length === lastFileSysLen){
          checkCount = 0;
        }
        lastFileSysLen = fileSysArray.length;
        checkCount -= 1;
        if( checkCount > 0){
          checkComplete();    // recurse
        } else {
          // STOP !!! and show FileSysArray
          this.jcInfo += "n" + "show FileSysArray";
          this.jcInfo += "n" + "fileSysArray.length = " + " [" + fileSysArray.length + "]";
          fileSysArray.sort();
          for( let elem of fileSysArray){
            this.jcInfo += "n" + elem;
          }
        }
      }, 1000);
    };
    // ************** RECURSE *************
    checkComplete();
  }