215 votes

HTML5 LocalStorage : Vérification de l'existence d'une clé

Pourquoi cela ne fonctionne-t-il pas ?

if(typeof(localStorage.getItem("username"))=='undefined'){
    alert('no');
};

L'objectif est de rediriger l'utilisateur de la page d'index vers la page de connexion s'il n'est pas déjà connecté. Ici, le localStorage.getItem("username")) n'est pas définie pour le moment.

C'est pour une application ios phonegap.

2 votes

Je suis surpris que personne ne l'ait encore dit - la sécurité côté client est fortement déconseillée. On peut simplement appuyer sur F12 et lancer localStorage['username']='admin' puis de mettre le bazar dans votre site web.

5 votes

@oriadam J'espère que personne ne base l'autorisation sur le localStorage, mais il est parfaitement correct de stocker le JWT accessToken dans le localStorage.

434voto

Thrustmaster Points 13656

Citant le spécification :

La méthode getItem(key) doit retourner la valeur actuelle associée à la clé donnée. Si la clé donnée n'existe pas dans la liste associée à l'objet, alors cette méthode doit renvoyer la nullité.

Vous devriez en fait vérifier contre null .

if (localStorage.getItem("username") === null) {
  //...
}

3 votes

Merci, c'était ma première erreur ! Mais cela ne fonctionne pas non plus avec if(typeof(localStorage.getItem("username"))===null){ alert('no') } ;

22 votes

Type de de null est "null" pas null (j'espère que je suis cohérent).

4 votes

@Gabriel : Retirer typeof(..) . Vérifiez à nouveau ma réponse.

78voto

user3332298 Points 21

Cette méthode a fonctionné pour moi :

if ("username" in localStorage) {
    alert('yes');
} else {
    alert('no');
}

1 votes

c'est la meilleure option, à mon avis, car elle permet de distinguer si une valeur a été définie et si elle peut être fausse/falsifiée.

14 votes

Cette solution donne des faux positifs pour des clés comme length . La réponse acceptée est la manière correcte de résoudre ce problème.

40voto

Derin Points 281

Mise à jour :

if (localStorage.hasOwnProperty("username")) {
    //
}

Une autre façon de procéder est pertinente lorsque la valeur n'est pas censée être une chaîne vide, null ou toute autre valeur fictive :

if (localStorage["username"]) {
    //
}

2 votes

C'est le diminutif de if( localStorage["username"]==undefined )

11 votes

Pas tout à fait - c'est un raccourci pour if (localStorage["username"]==undefined || localStorage["username"]==0 || localStorage["username"]==null || localStorage["username"]==false || localStorage["username"]=='') @AllanRuin

5 votes

@oriadam Pas tout à fait ; vous l'avez tous deux mal compris. C'est le diminutif de if (localStorage["username"]!==undefined && localStorage["username"]!==0 && localStorage["username"]!==null && localStorage["username"]!==false && localStorage["username"]!=='')

19voto

Quentin Points 325526

Le site Documentation MDN montre comment le getItem est mise en œuvre :

Object.defineProperty(oStorage, "getItem", {
      value: function (sKey) { return sKey ? this[sKey] : null; },
      writable: false,
      configurable: false,
      enumerable: false
    });

Si la valeur n'est pas définie, il retourne null . Vous testez pour voir si c'est undefined . Vérifiez si c'est null à la place.

if(localStorage.getItem("username") === null){

1 votes

C'est vrai, j'ai répondu à Thrustmaster ci-dessus. Mais ça ne marche pas mieux avec ça :/

1 votes

1 votes

@Gabriel - Dans votre commentaire ci-dessus, vous comparez la typeof la valeur à null. Vous devez comparer la valeur réelle.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X