打开本机相机后 Ionic App 崩溃 - 错误 20答案

【问题标题】：Ionic App crash after Open native camera - Error 20打开本机相机后 Ionic App 崩溃 - 错误 20
【发布时间】：2019-09-06 17:26:54
【问题描述】：

我正在使用 ionic 4 上的 cordova camera 插件来捕捉一些图像。

takePicture() {
   console.log(' camera takePicture ');
   const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE
    }

this.camera.getPicture(options).then((imageData) => {
  this.selectedImage = 'data:image/jpeg;base64,' + imageData;
 }, (err) => {
   // Handle error
   console.log('Camera issue:' + err);
 });

}

应用程序不会崩溃，但此代码总是返回 Camera issue: 20 并且相机界面永远不会出现在手机屏幕上。

我尝试像这样修改 config.xml 文件，因为我认为这是 android 权限的问题，但仍然无法正常工作：

<config-file mode="merge" parent="/*" target="AndroidManifest.xml">
        <uses-permission android:name="android.permission.CAMERA" />
        <uses-feature android:name="android.hardware.camera" />
        <uses-feature android:name="android.hardware.camera.autofocus" />
<!--            <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />-->
<!--            <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />-->
</config-file>

我不得不评论存储，因为它使同一行中的应用程序崩溃。

另外，我尝试卸载并重新安装插件

ionic cordova plugin remove cordova-plugin-camera
npm uninstall @ionic-native/camera

ionic cordova plugin add cordova-plugin-camera
npm install @ionic-native/camera

我不知道如何解决这个问题，我需要一些帮助。谢谢！

【问题讨论】：

标签： ionic-framework camera ionic4 ionic-native ionic-plugins

【解决方案1】：

您应该使用 cordova-plugin-camera-preview 插件在 ionic 中操作相机。请注意，此插件仅兼容 Android 和 iOS。

安装它：

ionic cordova plugin add cordova-plugin-camera-preview
npm install @ionic-native/camera-preview

用法：

// camera options (Size and location). In this example, the preview uses the rear camera and displays the preview in the back of the webview 
const cameraPreviewOpts: CameraPreviewOptions = { 
    x: 0, 
    y: 0, 
    width: window.screen.width, 
    height: window.screen.height, 
    camera: 'rear', 
    tapPhoto: true, 
    previewDrag: true, 
    toBack: true, 
    alpha: 1 
} 

// start camera 
this.cameraPreview.startCamera(cameraPreviewOpts).then( 
    (res) => { console.log(res) }, 
    (err) => { console.log(err) }
);

【讨论】：