Rozwiązania rezerwowe HTML5 Local Storage [zamknięte]

Szukam bibliotek javascript i kodu, który może symulować localStoragew przeglądarkach, które nie mają natywnej obsługi.

Zasadniczo chciałbym zakodować moją witrynę za pomocą localStoragedo przechowywania danych i wiedzieć, że będzie ona nadal działać w przeglądarkach, które jej natywnie nie obsługują. Oznaczałoby to, że biblioteka wykryłaby, czy window.localStorageistnieje, i użyłaby jej, jeśli tak. Jeśli tak nie jest, stworzyłoby jakąś metodę rezerwową pamięci lokalnej, tworząc własną implementację w window.localStorageprzestrzeni nazw.

Do tej pory znalazłem takie rozwiązania:

1. Prosta implementacja sessionStorage .
2. Implementacja korzystająca z plików cookie (niezadowolona z tego pomysłu).
3. Dojox.storage w Dojo , ale to jest własna rzecz, a nie rozwiązanie awaryjne.

Rozumiem, że Flash i Silverlight mogą być również używane do przechowywania lokalnego, ale nie znalazłem nic na temat używania ich jako rezerwy dla standardowego localStorage HTML5. Być może Google Gears również ma taką możliwość?

Udostępnij wszystkie powiązane biblioteki, zasoby lub fragmenty kodu, które znalazłeś! Byłbym szczególnie zainteresowany rozwiązaniami opartymi na czystym javascript lub jquery, ale zgaduję, że jest to mało prawdopodobne.

Używam PersistJS ( repozytorium github ), które bezproblemowo i przejrzyście obsługuje przechowywanie po stronie klienta dla twojego kodu. Używasz jednego interfejsu API i otrzymujesz wsparcie dla następujących backendów:

• flash: pamięć trwała Flash 8.
• biegów: trwała pamięć masowa oparta na wtyczce Google Gears.
• localstorage: przechowywanie wersji roboczych HTML5.
• whatwg_db: przechowywanie roboczej bazy danych HTML5.
• globalstorage: przechowywanie wersji roboczych HTML5 (stara specyfikacja).
• tj .: zachowanie danych użytkownika przeglądarki Internet Explorer.
• cookie: trwałe przechowywanie oparte na plikach cookie.

Każde z nich można wyłączyć - jeśli na przykład nie chcesz używać plików cookie. Dzięki tej bibliotece otrzymasz natywną obsługę pamięci masowej po stronie klienta w przeglądarkach IE 5.5+, Firefox 2.0+, Safari 3.1+ i Chrome; i wsparcie wspomagane przez wtyczki, jeśli przeglądarka ma Flash lub Gears. Jeśli włączysz obsługę plików cookie, będzie działać we wszystkim (ale będzie ograniczony do 4 kB).

Prosty wypełniacz localStorage oparty na czystym JS:

Demo: 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() ) {
            var ret = localStorage.getItem(name);
            //console.log(typeof ret);
            switch (ret) {
              case 'true': 
                  return true;
              case 'false':
                  return false;
              default:
                  return ret;
            }
        }
        else {
            // cookie fallback
            /*
             * after adding a cookie like
             * >> document.cookie = "bar=test; expires=Thu, 14 Jun 2018 13:05:38 GMT; path=/"
             * the value of document.cookie may look like
             * >> "foo=value; bar=test"
             */
            var nameEQ = name + "=";  // what we are looking for
            var ca = document.cookie.split(';');  // split into separate cookies
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];  // the current cookie
                while (c.charAt(0)==' ') c = c.substring(1,c.length);  // remove leading spaces
                if (c.indexOf(nameEQ) == 0) {  // if it is the searched cookie
                    var ret = c.substring(nameEQ.length,c.length);
                    // making "true" and "false" a boolean again.
                    switch (ret) {
                      case 'true':
                          return true;
                      case 'false':
                          return false;
                      default:
                          return ret;
                    }
                }
            }
            return null; // no cookie found
        }
    },
    del: function(name) {
        if( this.localStoreSupport() ) {
            localStorage.removeItem(name);
        }
        else {
            this.set(name,"",-1);
        }
    }
}​

czy widzieliście stronę polyfill na wiki Modernizr?

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

poszukaj sekcji magazynu internetowego na tej stronie, a zobaczysz 10 potencjalnych rozwiązań (stan na lipiec 2011).

powodzenia! znak

Poniżej znajduje się uporządkowana wersja odpowiedzi Aamira Afridiego, w której cały kod jest zamknięty w lokalnym zakresie.

Usunąłem odniesienia, które tworzą retzmienną globalną , a także usunąłem parsowanie przechowywanych ciągów „prawda” i „fałsz” na wartości logiczne w ramach BrowserStorage.get()metody, co może powodować problemy, jeśli ktoś próbuje w rzeczywistości przechowywać ciągi „prawda” lub "fałszywe".

Ponieważ lokalny interfejs API pamięci obsługuje tylko wartości ciągów, nadal można przechowywać / pobierać dane zmiennych JavaScript wraz z ich odpowiednimi typami danych, kodując te dane w ciąg JSON, który można następnie dekodować za pomocą biblioteki kodowania / dekodowania JSON, takiej jak https: //github.com/douglascrockford/JSON-js

var BrowserStorage = (function() {
    /**
     * Whether the current browser supports local storage as a way of storing data
     * @var {Boolean}
     */
    var _hasLocalStorageSupport = (function() {
        try {
            return 'localStorage' in window && window['localStorage'] !== null;
        } catch (e) {
            return false;
        }
    })();

    /**
     * @param {String} name The name of the property to read from this document's cookies
     * @return {?String} The specified cookie property's value (or null if it has not been set)
     */
    var _readCookie = function(name) {
        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) return c.substring(nameEQ.length, c.length);
        }

        return null;
    };

    /**
     * @param {String} name The name of the property to set by writing to a cookie
     * @param {String} value The value to use when setting the specified property
     * @param {int} [days] The number of days until the storage of this item expires
     */
    var _writeCookie = function(name, value, days) {
        var expiration = (function() {
            if (days) {
                var date = new Date();
                date.setTime(date.getTime() + (days*24*60*60*1000));
                return "; expires=" + date.toGMTString();
            }
            else {
                return "";
            }
        })();

        document.cookie = name + "=" + value + expiration + "; path=/";
    };

    return {
        /**
         * @param {String} name The name of the property to set
         * @param {String} value The value to use when setting the specified property
         * @param {int} [days] The number of days until the storage of this item expires (if storage of the provided item must fallback to using cookies)
         */
        set: function(name, value, days) {
            _hasLocalStorageSupport
                ? localStorage.setItem(name, value)
                : _writeCookie(name, value, days);
        },

        /**
         * @param {String} name The name of the value to retrieve
         * @return {?String} The value of the 
         */
        get: function(name) {
            return _hasLocalStorageSupport
                ? localStorage.getItem(name) 
                : _readCookie(name);
        },

        /**
         * @param {String} name The name of the value to delete/remove from storage
         */
        remove: function(name) {
            _hasLocalStorageSupport
                ? localStorage.removeItem(name)
                : this.set(name, "", -1);
        }
    };
})();

Osobiście wolę amplify.js . W przeszłości działał bardzo dobrze i poleciłem go do wszystkich lokalnych potrzeb przechowywania.

obsługuje IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+, iPhone 2+, Android 2+ i zapewnia spójny interfejs API do obsługi pamięci masowej w różnych przeglądarkach

store.js używa danych userData i IE oraz localStorage w innych przeglądarkach.

• Nie próbuje robić niczego zbyt skomplikowanego

• Bez plików cookie, bez pamięci flash, bez jQuery.

• Czysty interfejs API.

• Skompresowane 5 kb

https://github.com/marcuswestin/store.js

Strona MDN dotycząca magazynu DOM zawiera kilka obejść, które wykorzystują pliki cookie.

Krzesło również wydaje się dobrą alternatywą

fotel ogrodowy jest trochę jak kanapa, z wyjątkiem mniejszego i zewnętrznego. idealny dla aplikacji mobilnych html5, które wymagają lekkiego, adaptacyjnego, prostego i eleganckiego rozwiązania trwałego.

• kolekcje. instancja wózka ogrodowego to tak naprawdę tylko tablica obiektów.
• trwałość adaptacyjna. bazowy sklep jest wyodrębniony za spójnym interfejsem.
• zachowanie kolekcji z możliwością podłączania. czasami potrzebujemy pomocników w zbieraniu danych, ale nie zawsze.

Istnieje realstorage , który używa wtyczki Gears jako rozwiązania zastępczego.