Images from ImagePicker disappear occasionally

We’re using ImagePicker to get images and several times now all the images have disappeared on iOS.

This app has a list of items each of which has a list of images associated with it. When they disappear they disappear all at once and forever. We’re just storing the local result.uri and using and <Image> to display it. When they disappear the <Image>s show up blank. This has happened 2 or 3 times separated by a period of a few days. Maybe it’s correlated with new releases of the Expo app? This has affected iOS but not Android.

I thought maybe the data directory changed but printing uris from before and after the disappearance shows that they differ only in filename.

Any idea what’s going on?
If there is a way to get the image data to store it in AsyncStorage the application that could be a solid workaround. As it is we’re not sure how to recover when images disappear. Or if there is a way to peruse the data directory of Expo to see if maybe the images are still there but have changed somehow.

This problem happened even both before and after the iOS phone had more than one copy of the app (shared vs dev). And the app has only been released to the expo sharing world once.

Code:
Get image: pottery-log/ImagePicker.js at b28d4a82b095fef8c8e0df06fc954c1ffdac3a42 · seveneightn9ne/pottery-log · GitHub
Show image: pottery-log/PotListItem.js at b28d4a82b095fef8c8e0df06fc954c1ffdac3a42 · seveneightn9ne/pottery-log · GitHub

Sorry about this! What’s happening is that the ImagePicker API copies images to the mobile OS’s cache directory and gives you a URI within the cache directory. The OS may delete the cache directory to free up space, though, so the ImagePicker URI is not permanent – this is something we need to add to the docs for sure.

Currently the best way to persist an image is to upload it to your server and then display it using a remote URL with <Image source={{uri: 'https://yourserver.com/image.jpg'}} />. We’re actively thinking about an API to let you move images from the cache directory to the documents directory (this is a more permanent directory that doesn’t get arbitrarily cleared) but that doesn’t exist today.

Ah, that makes sense. Thanks for the explanation. Adding that it’s only saved to cache to the docs would be great.

1 Like

Thx @ide for clarifying this. Did this change in the meantime?
I am searching for a way to persist an image taken from the camera on the device - for both platforms, but couldn’t find anything.

Hey all, in the next version of the SDK we plan to have a more complete FileSystem API that will allow copying / moving files and aid in this. Will link to docs and paste example code here when it’s out!

2 Likes

Hey, has this been solved now?I’ve been trying to use the FileSystem API to move a picked image from the cache directory to the documentDirectory, but get a permissions error:
File ‘file:///var/mobile/Containers/Data/Application/4A654A99-A078-4998-927B-F61D994DE400/Library/Caches/ExponentExperienceData/xxxxxx/ImagePicker’ isn’t readable.

maybe the directory folder has not been created:
FileSystem.makeDirectoryAsync(FileSystem.documentDirectory + ‘myDirectoryName’)

is in 2020 an answer for this ? using expo-imagepicker, sounds good if can i change uri cache for uri document in the image picker object ?