Local storage clears on mobile browsers, deleting saved games?

Hi all! This is my first post here, so apologies if this isn’t the optimal category for my question.

I’m developing a browser-based IF game that relies on local storage to save game progress. For context: this is a choice-based game written in Ink and developed into a web app, which I’m hosting at itch.io (currently private).

The game’s interface is, hypothetically, very mobile-friendly and should be entirely playable on mobile devices (though I anticipate that it will be played primarily on desktop). But I’ve run into a potentially prohibitive problem.

When testing on iPhone, I find that clearing the browser from active memory (i.e. swiping up to “kill” it) deletes all previously saved games. Presumably, clearing the app is also wiping the local storage.

Local storage is working perfectly in my testing on desktop. And saved games persist in the mobile browser while the browser is still open/active.

Now, maybe most folks don’t close their mobile browser (or restart their device) frequently. But it’s definitely possible that someone would.

All the browser-based IF I’ve played before appears to use local storage. So, I am wondering if anyone else has run into this. If so, have you discovered any workarounds? Ideally, workarounds that don’t involve implementing some sort of external storage with user accounts (which is far beyond the scope of this project).

Thanks in advance for any tips!

2 Likes

Safari has some problem with the way Itch handles local storage in iframes. See this recent thread:

I don’t know a good solution.

1 Like

Yeah, and iOS Safari also doesn’t support the pageunload event and I think it blocks pop-ups on visibilitychange or popstate events (or maybe the timing is wrong? events happen after you’ve already left?) so I’m not at all sure there is a solution here. I’m turning up threads and questions going back to 2011 with people talking about potential work-arounds and seemingly not really finding anything… ugh

1 Like

Oooh, interesting! Thank you for bringing this to my attention!

Ah, I see! That’s too bad. Thank you for looking into it!

Maybe this is useful:

1 Like

I have this also. I save into browser storage for my web versions. Increasingly, there is no way around this. So when it’s gone, it’s gone!

If you want to try this out: Afair, in Magnetic Scripts I am using LocalStorage for save games as well, but it seems I am not running into this problem, neither on my IPhone nor my iPad. I am even having some save games in there from 2023, so it seems local storage even survived several iOS upgrades. Although of course this might be just coincidence unless we find the initial reason for the deletion of the storage

If you like you can try if the problems occurs on your devices when using the save function in Magnetic Scripts. So, in case it seems to work, I could try to dig into the code to see how I implemented this and what might be different from your solution. I haven’t touched the code since 10 years, but it still seems to work, perhaps something can be gained from this.

If you want to try out: https://msmemorial.if-legends.org/msa2/magscripts.html?gametag=pawn

Save with „save“ (no blanks on savegame name please… a long-standing bug). Then you can use the disk symbol at the bottom to see what is stored and then try whether the storage vanishes at some point.

I observed some strange behaviour as well: when Safari was in the background, immediately after bringing Safari back to the front and showing a Magnetic Scripts page, the storage appears to be empty. But it isn’t. After reloading the page everything is there again…

Let me know whether it works, then I can try to recover what I implemented…

Update: Thinking about this again, I am most probably using indexeddb there instead of local storage, is it might not really match your case. LocalStorage was only the last resort when indexed dB was not available. Sorry, this was so lang ago, the browser support for storage was different, and the sources are in a terrible state, I used some tool to merge all this together and it caused more chaos than order.

Update 2: Ok, sorry for raising false hopes. I had a quick glance at the sources and indeed it is IndexedDB via the Emscripten FS API. So, unfortunately different from your case.

3 Likes

I have only seen this problem reported on Itch, where the HTML runs in an iframe (in an itch.io subdomain).

2 Likes

I got some help with investigating this problem further, and sharing our findings here for anyone else running into this limitation.

In short, it appears that (at the moment) Safari (both iOS and desktop), as well as Firefox, simply does not support persistent local storage for websites embedded in iframes. This includes (but is not limited to) any browser-based game running on itch.io.

See: Permissions-Policy: storage-access - HTTP | MDN

Before learning this, we’d tried implementing:

  1. Permissions: query() method - Web APIs | MDN
  2. The persist() method of the StorageManager mentioned above by @andrewj.
    Both of those approaches failed, presumably for the reason mentioned above.

So it seems that browser-based games running on itch.io have to use some method other than local storage in order to actually store saved games on most non-Chrome browsers. Sigh.

1 Like

Someone told me that this is part of the “Prevent cross-site tracking” preference in Safari, and if you turn that off, this stops happening. I haven’t tested it.

I’ve seen some people recommend detecting if the game is running in an iframe, and if so putting up a button to open directly in a new tab.

But considering the base 7 day retention time for Safari, it might be best to use the Dropbox API etc. (I want to eventually support Dropbox in Parchment. I don’t know what it would take to support it in Twine.)