cordova插件cordova-plugin-file实现本地文件访问

林和畅
2023-12-01

在使用cordova开发H5模式APP时,我们经常会使用到本地文件。

cordova提供了很多插件供给我们使用详情请访问官网:https://www.npmjs.com/

经过前段时间的实战,还是感觉这个插件最实用:https://www.npmjs.com/package/cordova-plugin-file

cordova-plugin-file

安装:

cordova plugin add cordova-plugin-file

插件内部的实例有很多具体的直接看官网给出的文档或者直接搜插件使用就行我们这里就简单介绍两种实用的:

1:获取APP内部存储,这个APP内部存储是不需要获取手机权限就可以使用的,但是同样的你放在这个存储的东西是不能被其他APP所看到的。

实例:requestFileSystem

cordova的大部分插件的大部分实例都是回调性质的,所以建议使用Promise进行封装。

function createFile(path) {
  path = basePath + path;
  path = path.split("//").join("/");
  let pathArr = path.split("/");
  console.log(pathArr);
  return new Promise((resolve, reject) => {
    window.requestFileSystem(type, size, successCallback, errorCallback);
    //调用requestFileSystem组件成功
    function successCallback(fs) {
        //获取目录
      fs.root.getDirectory(pathArr[0], { create: true }, function(dirEntry) {
        console.log(pathArr[0]);
        pathArr = pathArr.slice(1);
        getFile(dirEntry, pathArr);
      });
    }
    //这是一个递归函数,一直到path的文件为止。
    function getFile(baseDirEntry, pathDirArr) {
      if (pathDirArr.length > 1) {
        baseDirEntry.getDirectory(pathDirArr[0], { create: true }, dirEntry => {
          pathDirArr = pathDirArr.slice(1);
          getFile(dirEntry, pathDirArr);
        });
      } else {
        //获取文件,如果没有则创建文件
        baseDirEntry.getFile(
          pathDirArr[0],
          { create: true, exclusive: true },
          function(fileEntry) {
            console.log(fileEntry);
            resolve(fileEntry);
          },
          errorCallback
        );
      }
    }

    function errorCallback(error) {
      console.log("创建文件失败,代码:%d", error.code);
      reject(error);
    }
  });
}

实例:resolveLocalFileSystemURL

function readRootFile(path) {
  path = decodeURIComponent(path);
  return new Promise((resolve, reject) => {
    //根据路径获取文件或文件夹
    window.resolveLocalFileSystemURL(
      path,
      entityFile => {//如果path是文件的路径,则返回的是file的实例,如果是文件夹的路径返回的则是目录下所有的文件及文件夹的实例
        entityFile.file(
          file => {
            resolve(file);
          },
          error => {
            console.log("读取文件失败:");
            console.log(error);
            reject(error);
          }
        );
      },
      err => {
        console.log("读取路径失败:");
        console.log(err);
        reject(err);
      }
    );
  });
}

使用该插件需要注意的是,插件有两种路径书写协议:

1:cdv文件协议、例该协议请参照官方文档:

cdvfile://localhost/persistent|temporary|another-fs-root*/path/to/file

就是以cdvfile打头

2:file,这种方法使用比较普遍

file:///storage/emulated/0/%E5%B0%8F%E8%AF%B4/sanguozhizhaihangtianxia%20zuozhejianzongshouxidizit/%E3%80%8A%E4%B8%89%E5%9B%BD%E4%B9%8B%E5%AE%85%E8%A1%8C%E5%A4%A9%E4%B8%8B%E3%80%8B%EF%BC%88%E6%A0%A1%E5%AF%B9%E7%89%88%E5%85%A8%E6%9C%AC%EF%BC%89%E4%BD%9C%E8%80%85%EF%BC%9A%E8%B4%B1%E5%AE%97%E9%A6%96%E5%B8%AD%E5%BC%9F%E5%AD%90.txt

获取内部root存储的方法官方文档其实就有:

我这里是使用的手机内部村粗所以选用了cordova.file.externalRootDirectory

在哪里存储文件

从 v1.2.0 开始,提供了重要文件系统目录的 URL。每个 URL 的格式为file:///path/to/spot/,并且可以转换为 DirectoryEntryusing window.resolveLocalFileSystemURL()

  • cordova.file.applicationDirectory- 安装应用程序的只读目录。( iOS , Android ,黑莓 10 , OSX , windows )

  • cordova.file.applicationStorageDirectory- 应用程序沙箱的根目录;在 iOS 和 Windows 上,此位置是只读的(但特定的子目录 [如 /DocumentsiOS 或/localStateWindows 上的] 是读写的)。其中包含的所有数据都是该应用程序的私有数据。( iOS , Android ,黑莓 10 , OSX )

  • cordova.file.dataDirectory- 使用内部存储器(在 Android 上,如果您需要使用外部存储器,请使用.externalDataDirectory)在应用程序沙箱中的持久和私有数据存储。在 iOS 上,此目录不与 iCloud 同步(使用.syncedDataDirectory)。( iOS , Android ,黑莓 10 , windows )

  • cordova.file.cacheDirectory- 缓存数据文件或您的应用程序可以轻松重新创建的任何文件的目录。当设备存储空间不足时,操作系统可能会删除这些文件,但是,应用程序不应依赖操作系统来删除此处的文件。( iOS , Android ,黑莓 10 , OSX , windows )

  • cordova.file.externalApplicationStorageDirectory- 外部存储上的应用空间。(安卓

  • cordova.file.externalDataDirectory- 将特定于应用程序的数据文件放在外部存储的何处。(安卓

  • cordova.file.externalCacheDirectory- 外部存储上的应用程序缓存。(安卓

  • cordova.file.externalRootDirectory- 外部存储(SD 卡)根。(安卓黑莓 10

  • cordova.file.tempDirectory- 操作系统可以随意清除的临时目录。不要依赖操作系统来清除这个目录;您的应用应始终根据需要删除文件。(iOSOSXWindows

  • cordova.file.syncedDataDirectory- 保存应同步的特定于应用程序的文件(例如到 iCloud)。( iOS ,视窗)

  • cordova.file.documentsDirectory- 应用程序私有的文件,但对其他应用程序有意义(例如 Office 文件)。请注意,对于OSX,这是用户的~/Documents目录。( iOS , OSX )

  • cordova.file.sharedDirectory- 对所有应用程序全局可用的文件(BlackBerry 10

 类似资料: