Can't show images from Android storage

ionic-v1
1

Hey,

I’m developing an app where users can choose a photo from their gallery to use as a profile photo. I’m using cordova-plugin-camera to get this image and I’m having some problems with displaying it. I tracked the issue down and it seems to be related with an impossibility to show images from the device internal storage.

In my case, I’m trying to display an image located in file:///storage/emulated/0/DCIM/Camera, but the app doesn’t show the image, just a broken link and the alt attribute on the img tag.

I’ve tried setting in both src and ng-src and the problem remains the same.

I’m testing it in a Samsung Galaxy S3 running Cyanogenmod 13.0 (Android 6.0.1). Any suggestion on how to solve this? Thanks in advance.

2

hi,

you can post your camera options object
and what error you get when you debug .

maybe your app don’t have permission to go to storage
so add in your config.xml

  <access origin="file:///*"/>

and in your angular config

  $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|file):/);
3

Hi,

I’ve already added the code on config.xml and now have added the one to the Angular module, like this:

angular.module(
  'myApp', [<dependencies>], function ($compileProvider) {
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|file):/);
  }
)

This is the code I’m using to get and show the image:

$scope.selectImage = function () {
  navigator.camera.getPicture(gotImage, errorImage, imageLibraryOptions);
};

var gotImage = function (imageData) {
  imageData = "file://"+imageData;
  console.log(imageData);
  $scope.profilePicture = imageData;
  $scope.$apply();
};

var errorImage = function (error) {
  console.log(error);
};

var imageLibraryOptions = {
  destinationType: Camera.DestinationType.NATIVE_URI,
  correctOrientation: true,
  sourceType: Camera.PictureSourceType.PHOTOLIBRARY
};

And on my view I have:

<img ng-src="{{ profilePicture }}" alt="Profile Picture" class="profile" />

I’ve already tried using NATIVE_URI and FILE_URI, but with no success. Also, I setted profilePicture manually to a path that I know that exists and I can access via browser.

I cannot think of what I’m missing. Any help would be greatly appreciated.

EDIT: I forgot to mention that I don’t get any errors on the debug. The image just shows as a broken link.

4

Hello

I am also trying the last days to find a solution to this problem and I do not. It seems that there is a bug with android when you try to show images using the URL format of file://…

I have searched everywhere and I did not found any explanation about the topic. I have also tested the same scenario in my Samsung S3 mobile phone and I am able to pick a picture from image galery but when shown in the view the pic is shown as a broken link with question mark. It only works when I use DATA_URL and the base64 conversion but in my case this does not help because I do now want to have memory issues.

If you find any solution on this topic please let me know

Thanks