Stockage web local

Le stockage web local ou stockage DOM (Document Object Model), ou encore localStorage, est une technique d'enregistrement de données dans un navigateur web. Le stockage web local permet l'enregistrement persistant, comme avec les cookies mais avec une capacité bien plus grande, et sans avoir à rajouter de données dans l'entête de requête HTTP.

Il existe deux types de stockage web local : le stockage local et le stockage de session, équivalant respectivement aux cookies persistants et aux cookies de session[1].

Contrairement aux cookies, les données en localStorage ne sont pas transmises automatiquement dans un en-tête à chaque requête HTTP réalisée vers le serveur. Elles sont conservées localement par le navigateur et sont accessibles avec une API JavaScript.

API localStorage

L'API JavaScript permet la sauvegarde de couples clé-valeur, les clés et valeurs étant obligatoirement des chaînes de caractères (string). Des objets peuvent être stockés après conversion en string avec par exemple JSON.stringify(object) puis restaurés depuis une string avec JSON.parse(str).

Principales méthodes de l'API (localStorage implémente l'interface Storage) :

  • localStorage.setItem(key, value) pour associer value à key
  • let a = localStorage.getItem(key) pour récupérer la valeur associée à key (retourne null si la clé n'est pas présente)
  • localStorage.removeItem(key) pour supprimer une correspondance
  • localStorage.clear() pour effacer toutes les clés
  • localStorage.length renvoie le nombre de clés stockées
  • localStorage.key(i) renvoie la clé d'indice n (n étant compris entre 0 et localStorage.length - 1)

Ces méthodes peuvent également être utilisées avec sessionStorage qui implémente également l'interface Storage ; contrairement à localStorage, sessionStorage réalise un stockage transitoire qui expire lorsque le navigateur est fermé.

Limite de taille

La taille des cookies est limitée à 4 ko. Celle du localStorage dépend des navigateurs :

Navigateur Taille du localStorage
Opera 10.50+ Mo[2]
Safari 8 Mo[3]
Firefox 34 10 Mo[3] (anciennement 5 Mo par origine en 2007[4])
Google Chrome 10 Mo par origine[5]
Internet Explorer 10 Mo par aire de stockage[6]

Références

  1. (en) Michael Mahemoff, « "Offline": What does it mean and why should I care? »,
  2. « Dev.Opera — Web Storage: Easier, More Powerful Client-Side Data Storage », sur dev.opera.com
  3. a et b Eiji Kitamura, « Working with quota on mobile browsers: A research report on browser storage - HTML5 Rocks », sur HTML5 Rocks - A resource for open web HTML5 developers,
  4. John Resig: DOM Storage. John Resig, ejohn.org. Retrieved on 2011-06-12.
  5. « Issue 21680002: Up the window.localstorage limit to 10M from 5M. - Code Review », sur chromiumcodereview.appspot.com
  6. Introduction to Web Storage. Microsoft Developer Network, msdn.microsoft.com. Retrieved on 2014-08-05.

Content Disclaimer

Informasi ini disarikan dari Wikipedia dan disajikan kembali untuk tujuan edukasi. Konten tersedia di bawah lisensi CC BY-SA 3.0. Kami tidak bertanggung jawab atas ketidakakuratan data yang bersumber dari kontribusi publik tersebut.

  1. The information displayed on this website is sourced in part or in whole from Wikipedia and has been adapted for the purpose of restating it. We strive to provide accurate and relevant information, however:
  2. There is no guarantee of absolute accuracy. Wikipedia is an open, collaborative project that can be edited by anyone, so information is subject to change.
  3. It is not intended to constitute professional advice. The content displayed is for informational and educational purposes only. For important decisions (e.g., medical, legal, or financial), please consult a professional.
  4. Content copyright. Wikipedia is licensed under the Creative Commons Attribution-ShareAlike License (CC BY-SA). This means that content may be reused with appropriate attribution and shared under a similar license.
  5. Responsible use. Any risk arising from the use of information from this website is entirely the responsibility of the user.