Ionic3中Base64 To Gallery插件致应用崩溃及iOS适配问题

Hey there! Let's work through this issue together—plugin crashes and plugin_not_installed errors on iOS are super common when dealing with Cordova plugins, but there are a few key fixes to try.

1. Ensure iOS Photo Permissions Are Configured #

iOS requires explicit permission to access the photo library, and missing these entries in your Info.plist can cause silent failures or plugin issues. Add these permissions either via config.xml or directly editing the Info.plist file in your iOS platform folder:

Via config.xml:
Add these lines inside the <platform name="ios"> block:

<edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryAddUsageDescription">
    <string>Need photo library access to save your images</string>
</edit-config>
<edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryUsageDescription">
    <string>Need photo library access to save your images</string>
</edit-config>

2. Clean Up Your Base64 String #

Sometimes the plugin fails if your base64 string includes the full data URI prefix (data:image/png;base64,). Try stripping that prefix before passing it to the plugin:

const cleanedBase64 = base64Image.replace(/^data:image\/[a-z]+;base64,/, '');
this.base64ToGallery.base64ToGallery(cleanedBase64, options)

3. Reinstall the Plugin & iOS Platform (Fixes Corrupted Installs) #

Corrupted plugin installations are a frequent cause of plugin_not_installed errors. Run these commands in order to do a clean reinstall:

# Remove the plugin and iOS platform
ionic cordova plugin remove cordova-base64-to-gallery
ionic cordova platform remove ios

# Reinstall the specific plugin version and iOS platform
ionic cordova plugin add cordova-base64-to-gallery@2.0.2
ionic cordova platform add ios

# Rebuild the iOS project
ionic cordova build ios

4. Verify Ionic Native Import & Provider Setup #

Double-check that you've correctly set up the plugin in your app module:

• In app.module.ts:

  import { Base64ToGallery } from '@ionic-native/base64-to-gallery/ngx';
  
  @NgModule({
    ...
    providers: [
      ...
      Base64ToGallery, // Make sure this is added here
      ...
    ]
  })
  export class AppModule { }
  

• In your component, ensure you're importing the ngx version (required for Ionic 4+):

  import { Base64ToGallery, Base64ToGalleryOptions } from '@ionic-native/base64-to-gallery/ngx';
  

5. Test with a Minimal Reproducible Case #

To rule out conflicts with other code (like this.navCtrl.pop() running too early), create a simple test page with only the save functionality:

// In a test component
import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';
import { Base64ToGallery, Base64ToGalleryOptions } from '@ionic-native/base64-to-gallery/ngx';

@Component({
  selector: 'app-test',
  template: '<button (click)="saveTestImage()">Save Test Image</button>'
})
export class TestComponent {
  constructor(private platform: Platform, private base64ToGallery: Base64ToGallery) {}

  saveTestImage() {
    // Use a known valid base64 string for testing
    const testBase64 = 'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==';
    const options: Base64ToGalleryOptions = { prefix: '_img', mediaScanner: true };

    this.platform.ready().then(() => {
      this.base64ToGallery.base64ToGallery(testBase64, options)
        .then(res => console.log('Saved:', res))
        .catch(err => console.error('Error:', err));
    });
  }
}

If this minimal case works, the issue is likely with your original base64 string or other code in your component conflicting with the plugin.

内容的提问来源于stack exchange，提问作者Mohan Gopi