Odśwież stronę powodując użytkownikowi uzyskać wylogować się automatycznie w kanciastych js

Question

Mam Logowanie API, które używam go w mojej służbie

function logInToService(callback, errback, login, password, rememberLogin) { 
      var url = "User/Login"; 

      var authorizationHeader = {'Authorization': "Basic " + login + ":" + password}; 
      httpWrapperService.post(url, {login: login, password: password}, authorizationHeader).then(
       function success(loginToken) { 
        // transform data here 

        self.currentUser.emailAddress = login; 
        self.currentUser.password = password; 
        // store token in a cookie 
        self.currentUser.token = loginToken; 
        $rootScope.currentUser = self.currentUser; 


        if (rememberLogin) { 

         localStorage.userName=login; 
         localStorage.password=password; 
        } 

        httpWrapperService.setAuthenticationToken(loginToken); 
        callback(loginToken); 
       }, 
       function error(errorObject) { 
        errback(errorObject); 
       } 
      ); 
     } 

I w moim nagłówka HTML jestem wyświetlając nazwę użytkownika na górze, kiedy dostaje zalogowany header.html

<div class="header-user-menu"> 
     <div ng-show="isUserLoggedIn() == false "> 
      <a href="" ng-click="$state.go('app.sr.login')" class="">{{'HEADER.LOGIN' | translate}}</a> 
      <!--<a ui-sref="app.sr.login" class="">{{'HEADER.LOGIN' | translate}}</a>--> 
     </div> 
     <div ng-show="isUserLoggedIn()" class="userName">{{'HEADER.WELCOME' | translate}} {{currentUser.emailAddress}}</div> 

    </div> 

i js plików jest tutaj

(function() { 
    'use strict'; 

    angular 
     .module('safe-repository') 
     .controller('AppLayoutCtrl', appLayoutCtrl); 

    // Implementation of controller 
    appLayoutCtrl.$inject = ['$rootScope', '$scope']; 

    function appLayoutCtrl($rootScope, $scope) { 


     $scope.isUserLoggedIn = isUserLoggedIn; 

     function isUserLoggedIn() { 
      if ($rootScope.currentUser 
       && $rootScope.currentUser.emailAddress != null 
       && $rootScope.currentUser.emailAddress != '') { 
       return true; 
      } 
      return false; 
     } 

    } 
})(); 

i tutaj mam jedną usługę rejestracji gdzie mam zdefiniowaną logInToService metoda

function registrationService($rootScope, httpWrapperService, $modal, $state, $cookieStore) { 
     var self = this; 
     // expose functions 
     self.hasUserAccessToLevel = hasUserAccessToLevel; 
     self.logInToService = logInToService; 
     self.getCurrentUserToken = getCurrentUserToken; 
     self.showRegistrationViewForLevel = showRegistrationViewForLevel; 
     self.currentUser = { 
      //emailAddress: '', 
      //password: '', 
      //token: '' 
     } 

     $rootScope.currentUser = null; 
     self.currentUserToken = null; 

function logInToservice (------){----}})(); 

Problemem jest to, że za każdym razem, gdy użytkownik naciśnie odświeżyć stronę F5, użytkownik zostaje wylogowany. Chociaż próbuję przechowywać dane w localstorage, ale w rzeczywistości nie uzyskuję przepływu kontroli.

Answer 1

Próbujesz zapisać dane do localStorage, ale ty nie czytasz. Zmienna, w której znajdują się dane użytkownika, jest zwykłą zmienną javascript, która jest resetowana po ponownym załadowaniu strony.

Trzeba zrobić coś takiego:

// ... 
// user logs in, remember it into the local storage 
// Note: is is better to use it via $window.localStorage 
$window.localStorage.setItem('user', JSON.stringify(user)); 
this.currentUser = user; 

//... 
// function to get the user, if this.currentUser is not set, 
// try to load from the local storage 
getUser: function() { 
    if (this.currentUser) { 
     return this.currentUser; 
    } 
    var storageUser = $window.localStorage.getItem('user'); 
    if (storageUser) { 
    try { 
     this.user = JSON.parse(storageUser); 
    } catch (e) { 
     $window.localStorage.removeItem('user'); 
    } 
    } 
    return this.currentUser; 
} 

// you may also want to remove the user data from storage when he logs out 
logout: function() { 
    $window.localStorage.removeItem('user'); 
    this.currentUser = null; 
}, 

Answer 2

Musisz utworzyć sesję do logowania, aby nie wylogować się po odświeżeniu strony. spojrzeć na ten link:

http://maffrigby.com/maintaining-session-info-in-angularjs-when-you-refresh-the-page/