ngStorage 和 $window.localStorage 有什么区别?什么时候用一个比另一个更好?我必须为 Web 应用程序选择其中之一。我必须保存个人资料用户和令牌的数据
4 回答
这是正常的 html5 本地存储:
使用本地存储,Web 应用程序可以在用户浏览器中本地存储数据。在 HTML5 之前,应用程序数据必须存储在 cookie 中,包含在每个服务器请求中。本地存储更安全,可以在本地存储大量数据,不影响网站性能。与 cookie 不同,存储限制要大得多(至少 5MB),并且信息永远不会传输到服务器。本地存储是按源(按域和协议)的。来自一个来源的所有页面都可以存储和访问相同的数据。
它为您提供访问存储的对象 - window.localStorage 和 window.sessionStorage
window.localStorage - 存储没有过期日期的数据
window.sessionStorage - 存储一个会话的数据,因此当浏览器选项卡关闭时数据会丢失
要检索数据,你会做这样的事情
localStorage.getItem("lastname");
因此,如果您想在 Angular 中执行此操作,您将使用 $window 服务,但它的行为与上面的示例相同。
解决 ngStorage:
一个 AngularJS 模块,它使 Web 存储以 Angular 方式工作。包含两个服务:$localStorage 和 $sessionStorage。无需像在 $window 服务中那样处理 getter 和 setter
您可以在 $scope 下通过引用传递 $localStorage 或 $sessionStorage:
$scope.$storage = $localStorage;
然后你可以使用 $storage as 和其他角度变量
<body ng-controller="Ctrl">
<button ng-click="$storage.counter = $storage.counter + 1">{{$storage.counter}}</button>
</body>
如果您将在您的 web 应用程序中使用 angularjs,我会使用 ngStorage,因为您会更加熟悉和熟悉语法。这只是我的意见。
该变量$window
通常是全局window
变量。Angular 推荐使用的原因$window
是因为有时您想模拟或替换“真实”window
对象(例如,出于测试目的)。
这么说,using$window.localStorage
意味着您正在使用 Local Storage 的 vanilla API,而 ngStorage 是
一个 AngularJS 模块,它使 Web 存储以 Angular 方式工作。包含两个服务:
$localStorage
和$sessionStorage
来源在这里
请注意 ngStorage 在内部使用 Angular watch 来监视$storage
/$localStorage
对象的更改,即需要一个摘要周期来将您的新值可靠地保存到浏览器的本地存储中。通常不是问题,但如果您在其中存储一个值$localStorage
并打开一个新选项卡而没有发生摘要循环,您可能无法在新打开的选项卡/窗口中看到存储的值。
在 IE 上遇到这个问题,不得不使用window.localStorage
它来解决它。
var setLocalStorage = function (token, uname)
{
$localStorage.token = token;
$localStorage.name = uname;
}
$timeout(setLocalStorage(token, userForm.uname), 500);
使用的模块:ngStorage
有用!