It’s already a while ago, but I lost track of these crazy modern internet things for a bit: In October Eric Pascarello offered a weblog post and an article about how to use Ajax in an hit-refresh-safe kinda way.
Now, what I like about his approach is that it’s very clean and straight forward; a solid and easy to understand solution to a well defined problem.
But the interaction problems between browsers and Ajax applications don’t stop here. Try hitting the back button, and you’ll be disappointed, be it IE or Firefox (as the two don’t work, I didn’t bother testing other browsers on it).
Luckily there’s help, in two ways:
Either you take the framework route and choose the dojo toolkit. It’s a toolkit that deals with xmlhttprequest on one hand and the representation of state changes on the other, something that generally used to be called DHTML effects.
If you choose to build things yourself, because you consider it too heavy, or for a million other reasons, Mike Stenhouse has written up his approach on fixing refresh, back button and bookmarking over at Content with Style. While he takes pretty much the same approach as the Dojo toolkit (both came out around the same time), he took the time to explain his approach thoroughly, which has been discussed ever since. So, rather than including a bit of a heavyweight js-library in your code, you should be able to build it all yourself after reading his article. Like this, you can reduce the load to only the essential code that you need.
Oh, before you get all excited: None of the back-button solutions work in Safari, and I have yet to see an ajax-fixed-back-button solution for it, in any variation.
Update:
Here’s also a little bit more to read about the Dojo approach, and I also found an O’Reilly Article about the same thing all over again, but Brad Neuberg, the author, packed it all nicely into a library and an exhaustive article (which probably leaves no questions open, but I can’t read it right now, so you’ll have to find out for yourself).