$cordovaCamera.getPicture does not work in ios 11 - ionic-framework

Question

I am using a ionic v1 app deployed on an ipad running on ios 11. When I try to run the app in ipad and click on the camera button , nothing happens. It stays as it is. I tried to look for issues mentioned similar to ios 10 and added relevant tags for info.plst file and also added the cross frame security bypass. I looked around but could not any solution to this. I have raised this question only after trying out all possible solutions that were specific for $cordovaCamera not working on ios 10. Even I tried to use the navigator.camera.getPicture() instead of $cordovaCamera.getPicture() but that didnt work either.
In my view I have
<a ng-click="takePicture()" style="color:#fff;">
In controller I have
$scope.takePicture = function (options) {
var options = {
destinationType: Camera.DestinationType.DATA_URL,
sourceType: Camera.PictureSourceType.CAMERA,
allowEdit: true,
quality: 100,
targetWidth: 300,
targetHeight: 300,
encodingType: Camera.EncodingType.JPEG,
popoverOptions: CameraPopoverOptions,
saveToPhotoAlbum: false,
correctOrientation:true
};
$cordovaCamera.getPicture(options).then(function(imageData) {
console.log('here');
$scope.pictureUrl = "data:image/jpeg;base64," + imageData;
console.log(imageData);
$scope.img_update = 1;
}, function(err) {
console.log(err);
});
};
In the controller I have also injected $cordovaCamera.
In index.html I have added
<meta http-equiv="Content-Security-Policy" content="default-src * gap://ready file:; script-src &apos;self&apos; &apos;unsafe-inline&apos; &apos;unsafe-eval&apos; *; style-src &apos;self&apos; &apos;unsafe-inline&apos; *">
In config.xml I have added these tags inside platform ios
<plugin name="cordova-plugin-camera" spec="~2.3.0">
<variable name="CAMERA_USAGE_DESCRIPTION" value="The app would like to access the camera when you attach photos to content." />
<variable name="PHOTOLIBRARY_USAGE_DESCRIPTION" value="The app would like to access the photo library when you attach images to content." />
</plugin>
<edit-config target="NSCameraUsageDescription" file="*-Info.plist" mode="merge">
<string>need camera access to take pictures</string>
</edit-config>
<edit-config target="NSPhotoLibraryUsageDescription" file="*-Info.plist" mode="merge">
<string>need to photo library access to get pictures from there</string>
</edit-config>
<edit-config target="NSLocationWhenInUseUsageDescription" file="*-Info.plist" mode="merge">
<string>need location access to find things nearby</string>
</edit-config>
<edit-config target="NSPhotoLibraryAddUsageDescription" file="*-Info.plist" mode="merge">
<string>need to photo library access to save pictures there</string>
</edit-config>

Answer 1

Update latest ios and android version then start following steps.
Step 1) Run this command
ionic cordova plugin rm camera
ionic cordova plugin add cordova-plugin-camera --variable CAMERA_USAGE_DESCRIPTION="your usage message" --variable PHOTOLIBRARY_USAGE_DESCRIPTION="your usage message"
Step 2) Add Options like this
var options = {
// Size
quality: 80,
targetWidth: 1024,
targetHeight: 768,
// Actions
allowEdit: false,
correctOrientation: false,
saveToPhotoAlbum: false,
// iOS
popoverOptions: CameraPopoverOptions,
// Basic
encodingType: Camera.EncodingType.JPEG,
sourceType: Camera.PictureSourceType.CAMERA,
destinationType: this.platform.is('ios') ? Camera.DestinationType.FILE_URI : Camera.DestinationType.DATA_URL,
};
And you Done.