What ways are there to achieve persistent, shareable storage in html & javascript alone?

Question

Edit: Let me try to clarify with a use case. I would love to be able to run a simple chat-box on an html/javascript page without running my -own- server. I can write the chat application's javascript just fine, but don't have a solution that allows me to store the data to make the chat messages visible to all browsing users. So my app would accept data, post it to a third-party data store (Ideally just in json format), and poll from the data store for updates periodically. That's not the only thing I would use such a json storage service/json storage engine for, but it is the clearest example.

---

I am backing away from server-side programming a little bit as html5 comes to the forefront, and exploring how much I can do with just html and javascript, in terms of functionality that I would previously have to achieve with a html/php/sql server stack. For example, on this nascent html5 site: http://tersh.royronalds.com/ I'm reusing flickr for image hosting and tumblr for blog post hosting. However, just as one example, I now find myself wanting to code a dynamic todo list, something where items can be added and ticked off as completed, and publicly displayed during that time. Another example might be a simple, persistent chat box.

For example, instead of using ajax to push boolean data and text about chat messages and changes to a php script that would then store the data in a mysql database, I'd love to push and pull the data to/from a third-party store that provides somewhat the same type of functionality as the localstorage API, but for json.

So I'd like to solve that using some method of storage with a public js API, e.g. some method for storing json, or any end format that supports strings and numbers really, and is store-able and retrievable, similar to localStorage, except persistent and shareable.

What public technologies/solutions are there for such a thing?

Answer 1

There are few options for this, even if they are not very nice, or well developed.

First off, the one most closely related to a server-side database is a Web SQL Database. This is not a recommended feature by the W3C (it does not use SQLite as a backend), however, it is currently supported in Chrome, Opera, Safari, and Firefox (with an add-on).

Spec

Second, we have Indexed Database API's. These are only supported by Chrome and Firefox. (And IE 10, but who cares?) It is more different from a normal database, but is a recommended method by the W3C.

Spec

Third, we have local storage. This is not a database-like system, it is more similar to cookies. However, these local storage items are better than cookies because they are each a key-value pair (and very intuitive to use, i might add). For example:

// Store value on the browser permanently
localStorage.setItem('key', 'value');
// Retrieve value
localStorage.getItem('key');
//Remove value
localStorage.removeItem('key');
//This is just a small selection of actions you can perform

Spec
Helpful Resource

Fourth, you should maybe take a quick peek at offline HTML. This is a system where select files in your site are downloaded by the browser, and can be used offline. I don't think this is useful for you, but check it out.

Spec
Helpful Guide

As you might be able to tell, I've had more experience in the last two than the first. I hope I was helpful anyway.