Window.sessionStorage

Cet article nécessite une relecture technique. Voici comment vous pouvez aider.

La propriété sessionStorage permet d'utiliser un objet Storage valable pour la session de navigation en cours et pour les pages du même domaine que la page actuelle. L'objet global sessionStorage est similaire à Window.localStorage, à la différence que les données enregistrées dans sessionStorage ont une durée vie limitée et expirent à la fin de la session de navigation actuelle. Une session de navigation dure aussi longtemps que le navigateur est ouvert et s'étend sur plusieurs chargements, rechargements et restaurations de pages. En revanche, une session de navigation n'est valable que pour le contexte de navigation actuel, c'est-à-dire que le fait d'ouvrir une page dans un nouvel onglet ou dans une nouvelle fenêtre provoquera l'initialisation d'une nouvelle session de navigation, ce qui diffère du comportement des sessions utilisant des cookies.

Syntaxe

// Enregistrer des données dans sessionStorage
sessionStorage.setItem('clé', 'valeur');

// Récupérer des donnée depuis sessionStorage
var data = sessionStorage.getItem('clé');

Valeur

Un objet Storage.

Exemple

L'exemple de code suivant accède à l'objet de stockage de session associé au domaine actuel et y ajoute une donnée à l'aide de Storage.setItem().

sessionStorage.setItem('myCat', 'Tom');

L'exemple suivant sauvegarde automatiquement le contenu d'un champ textuel. Si la page est accidentellement rafraîchie, le contenu du champ est restauré de sorte qu'aucune saisie n'est perdue.

// Récupération du champ à enregistrer
var champ = document.getElementById("champ");
 
// Vérification de l'existence d'une donnée enregistrée auparavant
// (ce ne sera le cas que si la page a été rafraîchie)
if (sessionStorage.getItem("autosave")) {
  // Restauration du contenu du champ
  champ.value = sessionStorage.getItem("autosave");
}
 
// Écoute des changements de valeur du champ
champ.addEventListener("change", function() {
  // Enregistrement de la saisie utilisateur dans le stockage de session
  sessionStorage.setItem("autosave", field.value);
});

Note: Veuillez vous référer à l'article Utilisation de l'API Web Storage pour des exemples plus complets.

Spécifications

Spécification Statut Commentaire
Web Storage (Second edition)
La définition de 'sessionStorage' dans cette spécification.
Recommendation  

Compatilibité des navigateurs

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
localStorage 4 3.5 8 10.50 4
sessionStorage 5 2 8 10.50 4
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 2.1 ? 8 11 iOS 3.2

Chaque navigateur attribue des capacités de stockage limitées pour localStorage et sessionStorage. Vous en trouverez certaines dans ce récapitulatif de tests des capacités de stockage attribuées en fonction du navigateur.

Note: à partir de iOS 5.1, Safari Mobile enregistre les données du localStorage dans le répertoire de cache, ce qui les rend susceptibles d'être occasionnellement purgées sur ordre du système d'exploitation, plus particulièrement s'il y a un manque d'espace mémoire disponible.

Voir aussi

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : Puxarnal, Weeple
 Dernière mise à jour par : Puxarnal,