HTML5: save user progress inside an iframe


Hello there,

I’ve just read the documentation that HTML5 builds uses IndexedDB for file operations. Unfortunately, when inside an iframe, the IndexedDB may not avaialble because of security concerns, specially on mobile devices (see “Security” section on MDN)

Unfortunately when publishing web games, your game is going to be served inside an iframe of someone else’s website. That’s how it works.

I wonder if anyone had this same issue, and what you’ve done to fix it? :sweat_smile:
I’m thinking on forking @Pkeod’s DefSave project, and adding conditions to use window.localStorage instead of Defold’s file operations to circunvent this limitation on iframes.

Would appreciate you guys can give any other insights

1 Like


It makes sense to make a localStorage alternative to get around this mobile Safari issue. It looks really easy to use you could even interact with it using just within a module.

You should be able to use window.self !== to detect if the project is currently in an iframe.



I noticed that this issue happens on regular Safari as well, not only mobile. Created a PR for this here @Pkeod :eyes:



I have invited you as a collaborator. You can merge it and make other changes / improvements you feel are necessary.

1 Like


Hi, I’ve just faced the same issue, progress is not saved in Safari when the game is wrapped by the iframe. And I see the PR was merged yesterday, but there was also a comment:

this PR does not solve the issue completely. Even using localStorage on Safari, the storage is cleared automatically unless you manually uncheck “Block All Cookies” in the Safari settings.

So, the issue is unsolvable or what? Are there any other workarounds?



Cloud save? But that might be far fetched.



Well, I’ve just implemented defsave and now progress saving works in Safari in iframe both on mobile and on macbook, so it’s enough for me to consider other cases as rare enough to not take care about =)

1 Like