Question

I’m using localstorage to do gmail-style autosave on a webpage.

So I basically save every 30 seconds to local, OK.

The problem is recovery. I can’t detect whether or not a user has crashed or incorrectly exited.

So let’s say the user crashed and loads up the form again, I can’t just continue saving and overwriting the previous autosaves. I need to restore the previous save.

But let’s say the user didn’t crash. He did everything correctly, but then used a different browser to edit the same file, so no new data to the previous browser’s localstorage.

He then loads up the file in the previous browser. The localstorage should not be restored in that case.

Assuming there’s no way to compare timestamps, how can I solve this problem?

Thanks.

Answer 1

Assuming you’re using an AJAX style page like Gmail.

Keep a boolean flag in the page level but outside localstorage and outside any particular refresh area.

var bIsInited = false;

The flag will be false whenever the entire page is reloaded whether it’s by the user clicking refresh or the page loading for the first time (i.e. after the browser being rebooted).

If this flag is false upon UI interaction then restore your UI’s state from localstorage and set the flag to true.

Continue persisting new changes to localstorage (unless, like before, the flag has been set to false by some means, in which case it’s the same signal to read localstorage into the UI before writing the UI back to localstorage).

There are many variations on this flow but that’s the gist of it.