HTML5: save user progress inside an iframe

#1

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

#2

It makes sense to make a localStorage alternative to get around this mobile Safari issue. It looks really easy to use https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API you could even interact with it using just html5.run() within a module.

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

2 Likes

#3

I noticed that this issue happens on regular Safari as well, not only mobile. Created a PR for this here @Pkeod :eyes: https://github.com/subsoap/defsave/pull/11

2 Likes

#4

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

1 Like