Le Stockage Local HTML5 solutions de secours

Question

Je suis à la recherche pour les bibliothèques javascript et le code qui permet de simuler localStorage sur les navigateurs qui n'ont pas de support natif.

En gros, je voudrais le code de mon site à l'aide d' localStorage pour stocker des données et de savoir qu'il continuera de fonctionner sur les navigateurs ne prennent pas en charge en mode natif. Cela signifierait une bibliothèque permettrait de détecter si window.localStorage existe et l'utiliser si elle n'. S'il n'existe pas, alors il faudrait créer une sorte de repli de la méthode de stockage local, par la création de sa propre mise en œuvre dans l' window.localStorage d'espace de noms.

Jusqu'à présent, j'ai trouvé ces solutions:

1. Simple sessionStorage mise en œuvre.
2. Une application qui utilise des cookies (pas très heureux avec cette idée).
3. Dojo du dojox.de stockage, mais il est, c'est quelque chose de personnel, pas vraiment une solution de repli.

Je comprends que Flash et Silverlight peut être utilisé pour le stockage local, mais n'ai rien trouvé sur leur utilisation comme un secours pour la norme HTML5 localStorage. Peut-être Google Gears est cette capacité de trop?

Veuillez faire part des bibliothèques, des ressources, ou des extraits de code que vous avez trouvé!!! Je serais particulièrement intéressé en javascript ou jquery-fondé des solutions, mais devine qui est peu probable.

Answer 1

Pure JS base simple localStorage polyfill:

Démo: http://jsfiddle.net/aamir/S4X35/

HTML:

<a href='#' onclick="store.set('foo','bar')">set key: foo, with value: bar</a><br/>
<a href='#' onclick="alert(store.get('foo'))">get key: foo</a><br/>
<a href='#' onclick="store.del('foo')">delete key: foo</a>​

JS:

window.store = {
    localStoreSupport: function() {
        try {
            return 'localStorage' in window && window['localStorage'] !== null;
        } catch (e) {
            return false;
        }
    },
    set: function(name,value,days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime()+(days*24*60*60*1000));
            var expires = "; expires="+date.toGMTString();
        }
        else {
            var expires = "";
        }
        if( this.localStoreSupport() ) {
            localStorage.setItem(name, value);
        }
        else {
            document.cookie = name+"="+value+expires+"; path=/";
        }
    },
    get: function(name) {
        if( this.localStoreSupport() ) {
            ret = localStorage.getItem(name);
            //console.log(typeof ret);
            switch (ret) {
              case 'true': 
                  return true;
              case 'false':
                  return false;
              default:
                  return ret;
            }
        }
        else {
            var nameEQ = name + "=";
            var ca = document.cookie.split(';');
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0) {
                    ret = c.substring(nameEQ.length,c.length);
                    switch (ret) {
                      case 'true': 
                          return true;
                      case 'false':
                          return false;
                      default:
                          return ret;
                    }
                }
            }
            return null;
        }
    },
    del: function(name) {
        if( this.localStoreSupport() ) {
            localStorage.removeItem(name);
        }
        else {
            this.set(name,"",-1);
        }
    }
}​

Answer 2

J'utilise PersistJS (github), qui gère le stockage côté client en toute transparence et de manière transparente à votre code. Vous utilisez une API unique et d'obtenir du soutien pour la suite de backends:

• flash: Flash 8 stockage persistant.
• engrenages: Google Gears base de stockage persistant.
• localstorage: HTML5 projet de stockage.
• whatwg_db: HTML5 projet de stockage de base de données.
• globalstorage: HTML5 projet de stockage (ancien spec).
• ie: Internet Explorer userdata comportements.
• cookie: Cookie persistant de stockage.

Aucun de ceux qui peut être désactivée, si, par exemple, vous ne voulez pas utiliser des cookies. Avec cette bibliothèque, vous aurez native client-side de stockage dans IE 5.5+, Firefox 2.0+, Safari 3.1+, et Chrome; et plugin-support assisté si le navigateur a des Flash ou des Engrenages. Si vous activez les cookies, il va travailler dans tout (mais sera limitée à 4 ko).

Answer 3

avez-vous vu le polyfill de la page sur le wiki Modernizr?

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills

cherchez le webstorage section sur cette page et vous verrez 10 solutions possibles (juillet 2011).

bonne chance! Marque

Answer 4

Personnellement, je préfère amplify.js. Il a vraiment bien fonctionné pour moi dans le passé et je l'ai recommandé pour tous les besoins de stockage.

prend en charge IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+, iPhone 2+, Android 2+ et fournit une API pour gérer le stockage de la croix-navigateur

Answer 5

JStorage fonctionne bien. Il a utilisé LocalStorage quand il peut, et utilise les données de l'Utilisateur sur les navigateurs plus anciens.

http://plugins.jquery.com/project/jStorage