Mise à jour (2016-11-01)
J'utilisais AmplifyJS mentionné ci-dessous pour contourner ce problème. Cependant, pour Safari en navigation privée, il retombait sur un stockage basé sur la mémoire. Dans mon cas, cela n'était pas approprié car cela signifie que le stockage est effacé lors de l'actualisation, même si l'utilisateur est toujours en navigation privée.
De plus, j'ai remarqué un certain nombre d'utilisateurs qui naviguent toujours en mode privé sur iOS Safari. Pour cette raison, une meilleure solution de rechange pour Safari consiste à utiliser des cookies (si disponibles). Par défaut, les cookies sont toujours accessibles même en navigation privée. Bien sûr, ils sont effacés lorsque vous quittez la navigation privée, mais ils ne sont pas effacés lors de l'actualisation.
J'ai trouvé la bibliothèque local-storage-fallback . De la documentation:
Objectif
Avec des paramètres de navigateur tels que "Navigation privée", il est devenu difficile de compter sur un window.localStorage fonctionnel, même dans les navigateurs plus récents. Même s'il peut exister, il lèvera des exceptions lors de la tentative d'utilisation de setItem ou getItem. Ce module exécutera les vérifications appropriées pour voir quel mécanisme de stockage du navigateur pourrait être disponible, puis l'exposera. Il utilise la même API que localStorage, il devrait donc fonctionner comme remplacement direct dans la plupart des cas.
Méfiez-vous des gotchas:
- CookieStorage a des limites de stockage. Faites attention ici.
- MemoryStorage ne persistera pas entre les chargements de page. Il s'agit plus ou moins d'un espace pour éviter les plantages de pages, mais cela peut être suffisant pour les sites Web qui ne font pas de chargement de page complète.
TL; DR:
Utilisez local-storage-fallback (API unifiée avec .getItem(prop)
et .setItem(prop, val)
):
Vérifiez et utilisez l'adaptateur de stockage approprié pour le navigateur (localStorage, sessionStorage, cookies, mémoire)
Réponse originale
Pour ajouter aux réponses précédentes, une solution de contournement possible serait de changer la méthode de stockage. Il existe quelques bibliothèques telles que AmplifyJS et PersistJS qui peuvent vous aider. Les deux bibliothèques permettent un stockage persistant côté client via plusieurs backends.
Pour AmplifyJS
stockage local
- IE 8+
- Firefox 3.5+
- Safari 4+
- Chrome
- Opera 10.5+
- iPhone 2+
- Android 2+
sessionStorage
- IE 8+
- Firefox 2+
- Safari 4+
- Chrome
- Opera 10.5+
- iPhone 2+
- Android 2+
globalStorage
données d'utilisateur
- IE 5 - 7
- userData existe également dans les versions plus récentes d'IE, mais en raison de bizarreries dans l'implémentation d'IE 9, nous n'enregistrons pas userData si localStorage est pris en charge.
Mémoire
- Un stockage en mémoire est fourni comme solution de secours si aucun des autres types de stockage n'est disponible.
Pour PersistentJS
- flash: stockage persistant Flash 8.
- gears: stockage persistant basé sur Google Gears.
- localstorage: stockage de brouillons HTML5.
- globalstorage: stockage de brouillon HTML5 (ancienne spécification).
- c'est-à-dire: les comportements des données utilisateur d'Internet Explorer.
- cookie: stockage persistant basé sur les cookies.
Ils offrent une couche d'abstraction afin que vous n'ayez pas à vous soucier du choix du type de stockage. Gardez à l'esprit qu'il peut y avoir des limitations (telles que des limites de taille) en fonction du type de stockage. En ce moment, j'utilise AmplifyJS, mais je dois encore faire des tests supplémentaires sur iOS 7 / Safari / etc. pour voir si cela résout réellement le problème.