web-dev-qa-db-fra.com

Angularjs: Pourquoi l'actualisation de page détruit les valeurs de $ rootScope?

Dans mon itinéraire local http: // localhost: 9000/#/deviceDetail/ / j’ai un contrôleur qui gère cette vue. Avant d’y accéder, j’ai défini certaines variables sur $rootScope (par exemple $rootScope.dashboards). 

Une fois sur cette vue, j'ai accès à la propriété des tableaux de bord, mais lorsque j'actualise la page avec la clé F5, par exemple, la propriété des tableaux de bord est perdue.

J'ai essayé de sauvegarder le $rootScope sur la variable localStorage mais des problèmes de référence circulaires se sont produits avec la méthode JSON.stringify.

Un conseil pour gérer ça?

javascriptangularjscookieslocal-storage
9
gabrielAnzaldo

AngularJS est un framework JavaScript, tout est stocké dans la pile de mémoire et la pile commence lorsque vous ouvrez une page et elle est détruite après la fermeture. Dans ce contexte, l'actualisation du navigateur est similaire à la fermeture et à la réouverture de la page.

Pour conserver la valeur après l'actualisation, vous devez la stocker dans un cookie. Pour ce faire, utilisez par exemple $cookies ou sessionStorage / localStorage comme recommandé par M K.

10
Marko Grešak

J'ai essayé de stocker des jetons d'authentification à l'aide de cookies en suivant l'article de Mise en route avec AngularJS et ASP.NET MVC - La troisième partie tant attendue . Mais les cookies sont détruits à chaque fois que je tape F5 ou que j'actualise le navigateur Chrome. 

Cet article indique que ngCookies permet de gérer l'actualisation de la page afin de conserver un jeton pour l'actualisation de la page. Et j'avais pensé que c'était le cas et je ne savais pas que les biscuits m'avaient tué. Il a été détruit si la page est rafraîchie! après des heures de recherche en ligne, je vois que cet article m'aide.

Selon M K, j'ai utilisé localStorage (ou sessionStorage) pour m'aider à me débarrasser du mal de tête des cookies. Utiliser des cookies pour stocker un jeton d'authentification ou autre est une mauvaise idée. J'ai rencontré ce problème et je me suis perdu (je ne connaissais pas le bogue provenant de "l'utilisation de cookies") car l'article ci-dessus mentionné/confirmé. Donc, c'était un bug dans cet article.

Merci mille fois, M K.

3
Thomas.Benz

Utilisez localStorage et $ stateChangerStart pour vérifier si vous utilisez ui.route Quelque chose comme ceci 

$rootScope.$on('$stateChangeStart', function(event, toState) {

            // Grab the user from local storage and parse it to an object
            var user = JSON.parse(localStorage.getItem('user'));            

            if(user) {

                $rootScope.currentUser = user;

            }
        });
0
CYBERSIX