How do I make images saved to Stored Variables persist between app updates?

Questions about Thunkable
1

Hi everyone,
I’m facing a quite annoying issue on my app and I would like to ask your precious help. It is really appreciated and I would like to thanks in advance to anyone wants to help me.

The problem
In my app you can save some pictures directly on the device, no cloud services involved here.

The fact is, when a user saves some pictures and then he updates the app from testfligth or similar (without uninstalling) it happens that the pictures are not visibile anymore.

This happens only with ios.

Some implementation details

The way I save pictures into the device is basically based on a stored variable list that I initialize once like in the following pictures.

image
image1002×246 22.9 KB

Then, each time the user add a pitcture the following happens (see that the variable “picture” is the output of the device camera or a picture taken from library).

image
image1043×756 86.5 KB

What I have already verified
I used some log in order to understand if the update of the app deletes some stored variables, but it is not the case.

In the following I show the two logs taken before and after the app update but they look the same

See the file path just after the user took the pictures.

“[{“img_front”:“file:///var/mobile/Containers/Data/Application/F0B2FA01-4B88-4E3D-9C1E-EB2464D0416E/Library/Caches/ImagePicker/39855492-DCA7-467B-AB71-FC53E64823D6.jpg”,“img_back”:“file:///var/mobile/Containers/Data/Application/F0B2FA01-4B88-4E3D-9C1E-EB2464D0416E/Library/Caches/ImagePicker/FA39139E-3DFC-4C3A-9CF4-FE77BEF7F9D4.png”}, … ]];”

And then see the file path just after the user updated the app, they are the same.

“[{“img_front”:“file:///var/mobile/Containers/Data/Application/F0B2FA01-4B88-4E3D-9C1E-EB2464D0416E/Library/Caches/ImagePicker/39855492-DCA7-467B-AB71-FC53E64823D6.jpg”,“img_back”:“file:///var/mobile/Containers/Data/Application/F0B2FA01-4B88-4E3D-9C1E-EB2464D0416E/Library/Caches/ImagePicker/FA39139E-3DFC-4C3A-9CF4-FE77BEF7F9D4.png”},…]];”

I hope that someone can help.
Thank you,
Daniele

1 Like
2

What is your exact input for the picture variable? What do those blocks look like?

How are you checking to make sure your stored list variable is accurate?

Are you accounting for the fact that your stored list has an empty object in the first item/index position?

Is there a reason you’re using an integer for the list item # when adding an object instead of using the more common method of inserting an object as the last item in the list? Are you sure those row #s already exist as list indexes (that is, you’re not trying to add an object as the 5th item in a list that only has three items)?

1 Like
3

Thank you @tatiang for your interest. Below you can find my explanation. Let me know if you see something wrong in my implementation.

The behaviuour I’m observing is more like if updating the iOS App to a new version, removes some permission to the app, or something similar.

“What is your exact input for the picture variable? What do those blocks look like?”

Photo from Camera is the input of variable picture

image
image600×660 45.9 KB

“How are you checking to make sure your stored list variable is accurate? Are you accounting for the fact that your stored list has an empty object in the first item/index position?”

I’m using the list as an array, this is because my app has 7 slot in which user can save pictures.
I check the accuracy with some logs and for sure it is likely that the first position is empty and the second is initialized. This is a case in which user saved the photo in the second slot.

“Are you sure those row #s already exist as list indexes (that is, you’re not trying to add an object as the 5th item in a list that only has three items)?”

I’m sure at least for two reasons:

  • if the user does not update the ios App to a new version, everything is working perfectly, even if I kill the app.

  • on Android everything is working perfectly, even if the user updates to a new version

1 Like
4

iOS and Android treat data differently. In Android photos are part of the gallery and if you uninstall an app that you used to capture images, the photo will still exist in the gallery unless the app stores the images in the app related folder.

In iOS however, images taken by the app are part of the app data and in you remove the app, the images will be deleted and you will not have access to them the next time you reinstall the app.

To test that, install you app and take a photo then go to the iPhone photos and copy that image you took. Remove the app and try to locate the image again, you would not find it and you will only find your own copy of the image that you took from the phone gallery.

5

Thanks @muneer for your feedback.

I’m pretty sure there will be another explanation for this case.

I completely agree with you in case one removes and then reinstalls the app.

But this case is different because pictures disappear when one updates the app with a new version, without reinstalling it first.

For what I know from the logs, stored variables and their contents (like the list) are not deleted after updating the app.

Thanks again.

1 Like
6

https://developer.apple.com/forums/thread/103935

It seems you’re not the only one.

1 Like
7

I’m just taking a stab here but if it’s kept in a cache, it may very well delete. The file-path indicates as such.

In that case, it would be more ideal to store photos in the devices memory or “save to camera Roll” like we can from other apps.

Seems the above is the default for Android per @muneer

I will touch base with our engineering team and see if we can find a solution or at leader more explanation. Thank you for raising this issue!

I’ll circle back later this week with an update.

2 Likes
8

Many thanks @muneer and @jared .

In the meantime I’ll will make some more troubleshooting and share with you any possible discovery.

I really hope to solve this because my app concept is based on the possibility to save pictures on the device, avoiding any cloud services.

It’s also the main reason why I choose Thunkable among other platforms.

Thank you,
Daniele

1 Like
9

Hi @jared did you discuss with the engineering team about the topic?
Many thanks
D

10

I haven’t heard anything yet. I may hear something today but will hear more next week for sure.

I will keep you posted! It’s been a busy week for the Eng team but your issue is not forgotten. It is still in our bug list to address/investigate. :slight_smile:

2 Likes
11

Dear @jared , have you had the chance to speak internally about the issue? Sorry to insist but this is blocking for my business.
If you have any possible workaround for me it’s ok, for example I wondering if is possible to save pictures in the customer’s cloud space like iCloud and Google.
Many thanks
D

1 Like
12

Thunkable already has the components and blocks to save to Cloudinary which is a cloud storage so why do not you use it.

If I where you I would use both the Cloudinary and the Stored Variables. When the app starts it would first check if the Stored Variables are present, if not then the app would get the images from Cloudinary and save them to the Stored Variables. This way you can view selected images even if the phone is not connected to internet.

13

Hi @muneer ,
thanks for the feedback, it’s all about a matter of privacy. I developed a wallet for identity documents and privacy (or the perception of privacy) is key (click to see the website of the project).

So, saving documents on the phone is the best solution for both me and customers because I have less constraints and risks regarding privacy rules (GDPR) and it is also much simpler to explain to customers that I cannot see their data by design.

Then, I’m thought about iCloud and G-Cloud because it is something out of my responsabilities, and it is something that user knows and probably trust more.

Finally, Cloudinary is a good solution in general but I think it is not in my case for three reasons, at least:

  • it moves the responsability about privacy on me
  • requests the implementation of registration and login step that I don’t have at the moment. The reason is that I’m working on an MVP and I’m trying to get the most feedback and value from the market with less effort as possible (you know that implementing login requests new screens, lot of testing, credentials management, it is also a killer for conversion rates)
  • It costs $$$

Thanks again
D

1 Like
14

In this case let me present you with two of my demo apps that, when joined together, could be the solution you are looking for.

1 - Save Canvas image to GDrive
https://x.thunkable.com/projectPage/618cfa678cdb0f0011998dbe

2 - Read image file from device and display it in the screen.
https://x.thunkable.com/projectPage/61f68431c3761001dba12df1

When reading the image from device, I read it as Base64 and when saving an image to GDrive I get the image as Base64 so you can combine both to make your solution.

If you are developing in DnD then you only need one of my apps because DnD now has a file picker component.

See the tutorial to save image to GDrive

1 Like
15

Very interesting @muneer, let me think about it for some days and I’ll come back to you with a feedback.
Many thanks,
D

1 Like
16

You’re welcome.

Another workaround is to create a backup trick where you ask the user for his/her email and send an app generated email with the images attached and send it to the user.

You can then provide an interface explaining that the user needs to save the attachment to his/her device and then your app will pick it up and save it again as Stored Variables.

17

Hi @jared please remember to kindly provide the update from you engineering team. It is very important to have that in order to evaluate all the options.
Many thanks.
D

1 Like
18

Dear @muneer ,
nice to hear you again. I have some more questions about your solutions and cloudinary, if you please can help me, it would be really appreciated.

1 - Save Canvas image to GDrive
https://x.thunkable.com/projectPage/618cfa678cdb0f0011998dbe

It was a nice help but, I tried to find a way to change dynamically the stage background image but it seems not to be feasible at the moment.

Maybe, do you have any other suggestions on this?

2 - Read image file from device and display it in the screen.
Thunkable

I made so much tests on different devices and I discovered that on Android (at least on my phone - Samsung A52 - Android Version 12) it is not working properly when the user choose to import images from phone camera. In this case, the web view function “receive message” it is not raised, so the picture cannot be showed. This happens randomly but it is not acceptable for production use.

Did you have any experience on this? Have you some suggestions?

Cloudinary

Finally, I was thinking about using Cloudinary and I would like to ask you (and the community) how it is possible to protect the user privacy regarding uploaded images.

I have this concern because, in my understanding, all the cloudinary links (image URL) are public so it is very easy for an attacker to steal pictures to other customers.

It seems to be very difficult to properly manage images on thunkable and this is quite frustrating.

Many thanks in advandce.
Regards,
D

1 Like
19

Managing them in app is not ideal at this time if they dont persist between updates. I’ll look into this to see if it’s a bug or simply a platform limitation.

You would need to store them in a secure backend such as xano or Firebase storage. You could first upload to cloudinary, get a url, move to a new location, then deletw from cloudinary.

You’d have to set it up but could probably start testing for free before you ever have to pay a dime.

2 Likes
20

I can have two suggestions, If you are using the DnD UI, then you can use the newly introduced File Picker

You can merge between this file picker and the Firebase Storage option.

[Update]
Example:
This is an image saved in the Firebase storage remote control keys

2 Likes