Question

我正在使用Ionic 3相机和文件插件来从用户的Android画廊应用中选择图像。该插件返回一个文件uri，我想用它通过File插件提取一个base64编码的图像，但是当我尝试从缓存目录中读取该文件时，我得到了NOT_FOUND_ERR。这是我的代码示例和一些日志输出：

this.camera.getPicture(this.getCameraOptionsForPhotoLibrary()).then((fileUri: string) => {

  const fileNameIndex: number = fileUri.lastIndexOf('/') + 1;

  // file:///storage/emulated/0/Android/data/com.myDomain.myApp/cache/
  const cacheDirectoryFromFileUri = fileUri.substring(0, fileNameIndex );

  //  FB_IMG_1532921240445.jpg?1532982282636 
  const fileName = fileUri.substring(fileNameIndex);

  this.file.readAsDataURL(cacheDirectoryFromFileUri, fileName).then(base64 => {
    alert('base64 cacheDirectoryFromFileUri success: ' + JSON.stringify(base64));
  }, err => {
    alert('base64 cacheDirectoryFromFileUri err: ' + JSON.stringify(err));
  });

请告知我，我可以提供更多信息来帮助进行故障排除。

Answer 1

在尝试复制您的错误时，我没有收到NOT_FOUND_ERR。

尽管此代码块

this.camera.getPicture(this.getCameraOptionsForPhotoLibrary()).then((fileUri: string) => {

  const fileNameIndex: number = fileUri.lastIndexOf('/') + 1;

  // file:///storage/emulated/0/Android/data/com.myDomain.myApp/cache/
  const cacheDirectoryFromFileUri = fileUri.substring(0, fileNameIndex );

  //  FB_IMG_1532921240445.jpg?1532982282636 
  const fileName = fileUri.substring(fileNameIndex);

  this.file.readAsDataURL(cacheDirectoryFromFileUri, fileName).then(base64 => {
    alert('base64 cacheDirectoryFromFileUri success: ' + JSON.stringify(base64));
  }, err => {
    alert('base64 cacheDirectoryFromFileUri err: ' + JSON.stringify(err));
  });
}

给我这个错误

base64 cacheDirectoryFromFileUri err: {"code":5,"message":"ENCODING_ERR"}

我正在使用这些选项

{
  quality: 100,
  destinationType: this.camera.DestinationType.FILE_URI,
  encodingType: this.camera.EncodingType.JPEG,
  mediaType: this.camera.MediaType.ALLMEDIA,
  sourceType: this.camera.PictureSourceType.PHOTOLIBRARY
}

以下行

const cacheDirectoryFromFileUri = fileUri.substring(0, fileNameIndex );

给我这样的东西

/storage/emulated/0/WhatsApp/Media/WhatsApp Images/

将该行更改为以下内容

const cacheDirectoryFromFileUri = 'file://'+fileUri.substring(0, fileNameIndex );

解决了这个问题。

或者，如果您是在从相机中获取图像并尝试获取base64编码的字符串后尝试从缓存中获取图像，则可以使用Camera.DestinationType： DATA_URL < / p>

destinationType: this.camera.DestinationType.DATA_URL

Answer 2

我无法按照描述的方式复制Patra的答案，但是自从我第一次发布以来，我确实设法通过测试提取了一些有用的信息。

在某些情况下，我发现是否删除了？后的数字？（FB_IMG_1532921240445.jpg？1532982282636），结果已成功返回。但这是基于几个设备/配置方案的条件。例如，如果我释放APK，则无法在Pixel 2的Oreo上运行。实际上，它在没有调用错误回调的情况下会失败，所以我什至无法处理失败。但是由于某种原因，如果我在同一设备上从带有-lc标志的CLI构建，它将按预期返回base64结果。

在测试7.0和7.1仿真设备时，无论构建配置如何，它都能按预期工作。

令人沮丧的体验是设备和配置之间的行为明显不同。我特别对livereload差异感到好奇，如果有人对为什么文件插件行为基于此标志进行更改有任何见解，那真是太好了。

我仍在尝试解决此问题，尽管除了破解插件外，我不确定该去哪里。我已经尝试了Base64本机插件，该插件最初似乎可以运行，但是似乎没有得到积极管理，根据github页面，存在许多未解决的问题。我可能最终会结合使用File和Base64插件来获取我现在需要的东西。

/ **更新** /

我们的团队成员在这里找到了针对我们问题的具体答案： https://forum.ionicframework.com/t/file-readastext-never-resolves/85375/24

如果此链接中断，请执行以下操作以解决该问题：

将cordova.js放在index.html中的polyfills.js之后

真是个可怕的错误。

Ionic 3在Android中将URL读取为base64

2 个答案: