Cordova   发布时间:2022-05-03  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了cordova – Ionic 3 – ios – 在屏幕上显示所选图像大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

概述

我设置了相机插件以从照片库中选择图像并使用以下代码将其上传到服务器: getImage() { //By default the camera retrieves the image as a JPEG file. const options: CameraOptions = { quality: 100, desTinationType: this.camera.Dest
我设置了相机插件以从照片库中选择图像并使用以下代码将其上传到服务器:

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上,图像的显示不起作用. (什么都没有显示)

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

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

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

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

解决方法

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

import { normalizeURL } from 'ionic-angular';

你的功能中,

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

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

大佬总结

以上是大佬教程为你收集整理的cordova – Ionic 3 – ios – 在屏幕上显示所选图像全部内容,希望文章能够帮你解决cordova – Ionic 3 – ios – 在屏幕上显示所选图像所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。