在angularjs中维护来自服务器应用程序的会话答案

【问题标题】：maintaining session from server application in angularjs在angularjs中维护来自服务器应用程序的会话
【发布时间】：2016-05-04 17:51:04
【问题描述】：

我有一个 angularjs 应用程序，在这个应用程序中我有一个登录表单，当我提交它时我调用了一个休息服务来验证用户到我的服务器应用程序，如下所示：

$http.get('http://localhost:8080/user', {
                headers : credentials ? {
            authorization : "Basic "
            + btoa(credentials.username + ":"
              + credentials.password)
          } : {};
              }).then(function(response) {
                if (response.data.name) {
                  $rootScope.authenticated = true;
                  $rootScope.username=response.data.name;
                  $rootScope.roles=response.data.authorities;
                  $rootScope.sessionid=response.data.details.sessionId;
                } else {
                  $rootScope.authenticated = false;
                }
              }, function() {
                $rootScope.authenticated = false;
              });

因此 $rootScope 将包含有关经过身份验证的用户的所有信息，但是当我刷新我的应用程序时，我附加到 $rootScope 的所有这些信息都将被删除。

请注意，http://localhost:8080/user 将始终保持会话。

我该如何解决？

【问题讨论】：

标签： angularjs

【解决方案1】：

您可以将其存储在 sessionStorage 中，也可以只获取从服务器端登录的当前用户。然后为了检索它们，请使用angular.run

angular.run(...function($http, $rootScope){
     // either use session storage or $http to retrieve your data and store them in $rootScope.
    // if you use $http i suggest you to store the promise of $http to be sure in your controller/route to wait that it has been resolved.
 });

使用 f5 时丢失存储的内容是正常的，这样做会丢失所有 javascript 上下文。 angular.run 的使用允许在调用任何控制器之前使用请求但是使用 $http 您可能需要等待承诺的结束。因此，最好在 $rootScope 中引用 promise 存储，以便能够在 javascript 部分中使用它。您可以直接引用模板中的数据，因为它们会在加载后立即刷新。

【讨论】：

【解决方案2】：

检查Local and Session storage 服务。您可以使用 getter 和 setter 轻松地将信息附加到变量，并通过页面刷新来检索它们。

示例：您可以像这样设置变量： localStorageService.set('myVar', data);

然后在刷新之后在另一个控制器中检索它，或者在您的应用程序的其他地方检索它： localStorageService.get('myVar');

它有很好的文档记录且易于使用。

【讨论】：