本地存储与 AngularJS $cacheFactory

Posted 2023-03-05

【中文标题】本地存储与 AngularJS $cacheFactory

【英文标题】：Local storage vs AngularJS $cacheFactory

【发布时间】：2013-10-18 17:23:46

【问题描述】：

我在存储大量客户端数据时遇到了问题，我无法决定哪种方式更好。现在我正在使用 AngularJS 的 cacheFactory，它工作正常，但所有数据都通过新会话重新加载。是否值得使用本地存储？

【问题讨论】：

您好，您可以使用 webstorage，然后您可以使用工厂获取数据，w3schools.com/html/html5_webstorage.asp

我最终选择了github.com/gsklee/ngStorage The Angular-way: No Getter 'n' Setter Bullshit！

值得注意的是，本地存储并不安全

@mb21 ngStorage 已死，关键公关非常出色

@Rodney 它没有活动和关键问题。

【参考方案1】：

如果您的目标是存储客户端和持久数据，则不能使用 $cacheFactory，它只会缓存当前会话的数据。

一种解决方案是使用新的本地存储 API。 This awesome Angular module 为您完成了所有肮脏的工作，甚至还使用旧浏览器的 cookie！

【讨论】：

不，您应该在存储对象之前序列化对象（并反序列化以读取它们），通常以 JSON 格式。但是直接存储对象并没有多大意义，因为所有持久性存储都必须使用文件，因此线性化数据。

投票支持提及本地存储模块。为我节省了很多编码！

@Rasalom 我迟到了，但我查看了 localstorage 模块的源代码，它确实存储了对象，而不需要你自己对它们进行 json 编码/解码（它这样做是为了你）。这个功能可能是在这篇文章之后开发的，但我想分享给未来的读者。

您链接的演示页面实际上不起作用，控制台中存在未捕获的语法错误。

请注意 $cacheFactory 不会缓存当前会话的数据，它会将数据缓存在内存中，因此只要您的 Angular 应用程序处于活动状态。例如，页面刷新会杀死它。 @Blackhole 您能否更新一下以避免误导人们？

【参考方案2】：

另一种解决方案是http://jmdobry.github.io/angular-cache/，它与 ngResource 配合得很好，也可以轻松配置为同步到 localStorage，因此在页面刷新后不需要重新完成请求。

$resource('my/kewl/url/:key',  key: '@key' , 
  'get':  method: 'GET', 
           cache: $angularCacheFactory('MyKewlResourceCache',  
                                          storageMode: 'localStorage' )
         
);

【讨论】：

我觉得这个比公认答案中的解决方案更强大。感谢 $resource 在其官方网站上没有看到它

【参考方案3】：

$cacheFactory 似乎显然不是您的解决方案，因为正如 Blackhole 所说，每次会话到期时都会清除缓存。 $cacheFactory 只是 Angular 方式的 memcache 实现。

angular-cache 只是一个辅助 API，基本上它为 $cacheFactory 添加了选项，其中一个选项是将缓存存储到持久存储中（如 localStorage）。

因此，如果您想将数据存储在持久存储中，您可以使用angular-local-storage 或$cookieStore 等可用模块之一，但它会创建cookie...

【讨论】：

同样，$cacheFactory 不会缓存当前会话的数据，它会将数据缓存在内存中，因此只要您的 Angular 应用程序处于活动状态。例如，页面刷新会杀死它。 @user3305685 你能更新一下，以免误导人们吗？

【参考方案4】：

另一个完成这项工作的 Angular 模块：https://github.com/jmdobry/angular-cache