JS comment mettre en cache une variable

Ce que je veux faire, c'est pouvoir créer une variable, lui donner une valeur, fermer et rouvrir la fenêtre, et pouvoir retrouver la valeur que j'ai définie dans la dernière session. Quelle est la manière la plus simple de faire cela? Les réponses de JQuery sont les bienvenues.

Utilisez localStorage pour cela. Il est persistant au cours des sessions.

L'écriture :

localStorage['myKey'] = 'somestring'; // only strings 

En train de lire :

 var myVar = localStorage['myKey'] || 'defaultValue'; 

Si vous devez stocker des structures complexes, vous pouvez les sérialiser dans JSON. Par exemple :

En train de lire :

 var stored = localStorage['myKey']; if (stored) myVar = JSON.parse(stored); else myVar = {a:'test', b: [1, 2, 3]}; 

L'écriture :

 localStorage['myKey'] = JSON.stringify(myVar); 

Notez que vous pouvez utiliser plus d'une clé. Ils seront tous récupérés par toutes les pages sur le même domaine.

Sauf si vous souhaitez être compatible avec IE7, vous n'avez aucune raison d'utiliser les cookies obsolètes et les petits.

Vous avez trois options:

  1. Cookies: https://developer.mozilla.org/en-US/docs/DOM/document.cookie
  2. DOMStorage (sessionStorage ou localStorage): https://developer.mozilla.org/en-US/docs/DOM/Storage
  3. Si vos utilisateurs sont connectés, vous pouvez persévérer des données dans le DB de votre serveur qui est connecté à un utilisateur (ou à un groupe)

Vous pourriez créer un cookie si cela est permis dans votre requérant. Si vous choisissez de prendre la route des cookies, la solution pourrait être la suivante. De plus, le bénéfice avec un cookie est après que l'utilisateur ferme le navigateur et le ré-ouvre, si le cookie n'a pas été supprimé, la valeur sera persistée.

Cookie * Créer et stocker un cookie: *

 function setCookie(c_name,value,exdays) { var exdate=new Date(); exdate.setDate(exdate.getDate() + exdays); var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString()); document.cookie=c_name + "=" + c_value; } 

La fonction qui renverra le cookie spécifié:

 function getCookie(c_name) { var i,x,y,ARRcookies=document.cookie.split(";"); for (i=0;i<ARRcookies.length;i++) { x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("=")); y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1); x=x.replace(/^\s+|\s+$/g,""); if (x==c_name) { return unescape(y); } } } 

Afficher un message de bienvenue si le cookie est configuré

 function checkCookie() { var username=getCookie("username"); if (username!=null && username!="") { alert("Welcome again " + username); } else { username=prompt("Please enter your name:",""); if (username!=null && username!="") { setCookie("username",username,365); } } } 

La solution ci-dessus enregistre la valeur à travers les cookies. C'est un moyen assez standard sans enregistrer la valeur du côté du serveur.

Jquery

Définissez une valeur sur le stockage de session.

Javascript:

 $.sessionStorage( 'foo', {data:'bar'} ); 

Récupérer la valeur:

 $.sessionStorage( 'foo', {data:'bar'} ); $.sessionStorage( 'foo' );Results: {data:'bar'} 

Local Storage Now permet de regarder le stockage local. Disons par exemple que vous avez un ensemble de variables que vous souhaitez persister. Vous pourriez faire comme suit:

 var names=[]; names[0]=prompt("New name?"); localStorage['names']=JSON.stringify(names); //... var storedNames=JSON.parse(localStorage['names']); 

Exemple côté serveur utilisant ASP.NET

Ajouter à Sesion

 Session["FirstName"] = FirstNameTextBox.Text; Session["LastName"] = LastNameTextBox.Text; 

// Lorsque vous récupérez un objet à partir de l'état de la session, lancez-le sur // le type approprié.

 ArrayList stockPicks = (ArrayList)Session["StockPicks"]; // Write the modified stock picks list back to session state. Session["StockPicks"] = stockPicks; 

J'espère que vous avez répondu à votre question.

Consultez mon js lib pour la mise en cache: https://github.com/hoangnd25/cacheJS

Mon blog: Nouvelle façon de mettre en cache vos données avec Javascript

Caractéristiques:

  • Utilisez-la de manière pratique comme clé pour enregistrer le cache
  • Support array et localStorage
  • Effacer le cache par contexte (effacer toutes les publications du blog avec authorId = "abc")
  • Pas de dépendance

Utilisation de base:

Sauvegarde du cache:

 cacheJS.set({blogId:1,type:'view'},'<h1>Blog 1</h1>'); cacheJS.set({blogId:2,type:'view'},'<h1>Blog 2</h1>', null, {author:'hoangnd'}); cacheJS.set({blogId:3,type:'view'},'<h1>Blog 3</h1>', 3600, {author:'hoangnd',categoryId:2}); 

Récupération du cache:

 cacheJS.get({blogId: 1,type: 'view'}); 

Flushing cache

 cacheJS.removeByKey({blogId: 1,type: 'view'}); cacheJS.removeByKey({blogId: 2,type: 'view'}); cacheJS.removeByContext({author:'hoangnd'}); 

Fournisseur de commutation

 cacheJS.use('array'); cacheJS.use('array').set({blogId:1},'<h1>Blog 1</h1>')};