cordova – Ionic 3 – ios – 在屏幕上显示所选图像

我设置了相机插件以从照片库中选择图像并使用以下代码将其上传到服务器：

getImage() {
  //By default the camera retrieves the image as a JPEG file.
  const options: CameraOptions = {
    quality: 100,
    destinationType: this.camera.DestinationType.FILE_URI,
    sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
    targetWidth:1080,
    targetHeight:1080,
    correctOrientation: true,
    mediaType: this.camera.MediaType.PICTURE,
    encodingType: this.camera.EncodingType.JPEG

  }

  this.camera.getPicture(options).then((fileUri) => {

    if (this.platform.is('ios')) {
        return this.crop.crop(fileUri, {quality: 100});
      } else if (this.platform.is('android')) {
        // Modify fileUri format, may not always be necessary
        fileUri = 'file://' + fileUri;

        /* Using cordova-plugin-crop starts here */
        return this.crop.crop(fileUri, { quality: 100 });
      }
  }, (err) => {
    console.log(err);

  }).then((path) => {
    // path looks like 'file:///storage/emulated/0/Android/data/com.foo.bar/cache/1477008080626-cropped.jpg?1477008106566'
    console.log('Cropped Image Path!: ' + path);
    this.imagePath = path;
    return path;
  });
}

然后,我在屏幕上显示我的图像预览,如下所示：

<img [src]="imagePath"  />

在iOS和Android上,选择图像,裁剪和上传工作都非常好.但是,在iOS上,图像的显示不起作用. (什么都没有显示)

我的控制台日志显示以下内容：

2017-12-07 15:06:52.559614-0500 fd-app[2537:1186586] [MC] System group container for systemgroup.com.apple.configurationprofiles path is /private/var/containers/Shared/SystemGroup/systemgroup.com.apple.configurationprofiles
2017-12-07 15:06:52.560425-0500 fd-app[2537:1186586] [MC] Reading from public effective user settings.
2017-12-07 15:06:55.754175-0500 fd-app[2537:1186662] [discovery] errors encountered while discovering extensions: Error Domain=PlugInKit Code=13 “query cancelled” UserInfo={NSLocalizedDescription=query cancelled}
2017-12-07 15:07:04.589982-0500 fd-app[2537:1186586] Cropped Image Path!: file:///var/mobile/Containers/Data/Application/8B2CD0E8-F6AC-4530-BF02-D2F7A188EAC2/tmp/cdv_photo_004.jpg

我尝试将照片库使用情况属性添加到Info.plist文件,但这没有帮助.有什么建议接下来要尝试什么？

更新：不确定这是否与它有关,但我使用的是Xcode 9.2 beta,因为我的iPhone是11.2

此外,我正在谷歌搜索的一切指向这是一个权限问题的事实,但是,选择图像后,图像出现在裁剪器…这让我怀疑这里发生了什么奇怪的事情？裁剪器如何显示图像而不显示HTML页面？

如果您使用 WKWebview这是IOS 11中的默认webview,根据官方 blog post,您需要 rewrite文件：// url才能在HTML中使用.

If you’re working with local files (text files, images, videos), you’ll need to make sure that the path of file does not have file:// in front of it.

import { normalizeURL } from 'ionic-angular';

在你的功能中,

this.imagePath = normalizeURL(path);
    return path;

进一步检查troubleshooting section,它说的相同.