AngularJs在認證後將用戶數據保存到會話中

我是AngularJS的新手，現在我試圖用身份驗證構建我的第一個系統。一切正常，只是，當用戶刷新頁面，所有的用戶信息都不見了......AngularJs在認證後將用戶數據保存到會話中

我跟着這個教程：

http://www.sitepoint.com/implementing-authentication-angular-applications/

現在，這是我傾向於確保用戶數據保留在它應該是的位置：

當用戶登錄時，我的API以JSON的形式返回他/她的詳細信息，然後將其分別放入$rootScope變量以用於站點以及會話中。旁邊的是，我在簽署時返回true rootscope一個變量，而假的時候沒有，像這樣：

$rootScope.loggedin = true; 
$rootScope.user = data; 
$window.sessionStorage["info"] = data; 
// console.log($window.sessionStorage["info"]);

這一切都發生在認證的工廠。

然後，當用戶刷新，而同一工廠再次跑了，下面的函數將開始工作：

function init() { 
    if ($window.sessionStorage["info"]) { 
     $rootScope.loggedin = true; 
     $rootScope.user = $window.sessionStorage["info"]; 
     info = $window.sessionStorage["info"]; 
    } 
} 
init();

（我認爲這會工作，因爲文章和其他各種來源的網頁上這麼說）

然後在我的HTML，我用的loggedIn變量來確定用戶是否登錄：

<div ng-show="!loggedin"> 
    <a href="/login" class="btn btn-default btn-flat sidebar-toggle" style="position:relative;top:-3px; right: 5px;">Log in </a> 
    <a class="btn btn-default btn-raised" style="background: #03A9F4; color:#fff; position:relative;top:-3px; right: 5px;">Registreer</a> 
</div> 

<div ng-show="loggedin"> 
    <ul class="nav navbar-nav"> 
     <li class="drop"> 

      <a href="bootstrap-elements.html" data-target="#" class="dropdown-toggle" data-toggle="dropdown">{{user.username}} <b class="caret"></b></a> 
      <ul class="" style="z-index:99999999999;"> 
       <li><a href="javascript:void(0)">Some log-in only stuff</a></li> 

      </ul> 
     </li> 
    </ul> 
</div>

現在，所有這一切都工作得很好，當我是勞但是當我刷新頁面時，它會檢測到我已登錄，但我的名字只是保持空白，因爲我猜未定義。

這是爲什麼，我該如何解決？

謝謝。

來源

2015-11-06 Wesley Peeters

網絡存儲只存儲字符串和字符串。 'user'絕對不是一個字符串。你不應該猜測'user'的值，而是檢查它。 – zeroflagL

我建議您切換到喜歡的東西，而不是ngStorage：https://github.com/gsklee/ngStorage

$ window.sessionStorage不會跨新標籤或窗口仍然存在，並根據您的瀏覽器，甚至可能不能跨越刷新頁面。所以至少應該使用localStorage（不必像$ window/window的方法那樣調用，除非你期望它在你的範圍中被覆蓋，順便說一句）。

此外，通常會使用sessionStorage上的getter和setter方法（getItem和setItem）：https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage - 雖然我相信他們可以使用該對象[「key」]語法，但您可能無法使用該對象[「key」]語法。

來源

2015-11-06 23:36:11 djvs

我寫了一個更清潔的對象來將數據存儲在本地存儲中。

var LocalStorageManager = { 
    setValue: function(key, value) { 
     window.localStorage.setItem(key, JSON.stringify(value)); 
    }, 
    getValue: function(key) { 
     try { 
      return JSON.parse(window.localStorage.getItem(key)); 
     } catch (e) { 

     } 
    } 
};

將數據保存到本地存儲：

LocalStorageManager.setValue("key",data);

要檢索的數據：

LocalStorageManager.getValue("key");

來源

2015-11-15 01:22:46

AngularJs在認證後將用戶數據保存到會話中

回答

相關問題