一、什么是缓存

一个缓存就是一个组件,它可以透明地存储数据,以便未来可以更快地服务于请求。

缓存能够服务的请求越多,整体系统性能就提升得越多。

二、Angular 中的缓存

2.1 $cacheFactory 简介

$cacheFactory 是一个为所有Angular服务生成缓存对象的服务。在内部, $cacheFactory 会创建一个默认的缓存对象,即使我们并没有显示地创建。

要创建一个缓存对象,可以使用 $cacheFactory 通过一个ID创建一个缓存:

var cache = $cacheFactory('myCache');

这个 $cacheFactory 方法可以接受两个参数:

cacheId (字符串):这个 cacheId 就是创建缓存时的ID名称。可以通过 get() 方法使用缓存名称来引用它。

capacity :这个容量描述了在任何给定时间要使用缓存存储并保存的缓存键值对的最大数量。

2.2 缓存对象

缓存对象自身有下列这些方法可以用来与缓存交互。
info() : info() 方法返回缓存对象的ID、尺寸和选项。
put() : put() 方法允许我们把任意JavaScript对象值形式的键(字符串)放进缓存中。cache.put("hello","world");
put() 方法会返回我们放入缓存中的值。
get() : get() 方法让我们能够访问一个键对应的缓存值。如果找到了这个键,它会返回它的值;如果没有找到,它会返回 undefined 。cache.get("hello");
remove() : remove() 函数用于在找到一个键值对的情况下从缓存中移除它。如果没有找到,它就会返回 undefined 。cache.remove("hello");
removeAll() : removeAll() 函数用于重置缓存,同时移除所有已缓存的值。
destory() : destory() 方法用于从 $cacheFactory 缓存注册表中移除指定缓存的所有引用。

三、$http 中的缓存

Angular的 $http 服务创建了一个带有ID为 $http 的缓存。要让 $http 请求使用默认的缓存对象很简单: $http() 方法允许我们给它传递一个 cache 参数。

 3.1 默认的 $http 缓存
当数据不会经常改变时,默认的 $http 缓存就特别有用了。可以像这样设置它:

$http({method: 'GET',url: '/api/users.json',cache: true  //设置为true只是用来使用$http默认的缓存机制
});

现在,通过 $http 到URL /api/user.json 的每个请求将会存储到默认的 $http 缓存中。这个$http 缓存中的请求键就是完整的URL路径。

如果需要,也可以操作这个默认的 $http 缓存(比如,如果我们发起的另外一个没有缓存的请求提醒我们发生了增量变化,我们就可以在默认的 $http 请求中清除这个请求)。

为了引用 $http 的默认请求,只需通过 $cacheFactory() 使用ID来获取到该缓存:
var cache = $cacheFactory('$http');
对于所掌控的缓存,我们可以在需要时进行所有的正常操作,比如检索已缓存的响应,从缓存中清除条目,或者消除所有缓存的引用。
// 获取上一次请求的缓存
var usersCache = cache.get('http://example.com/api.users.json');
// 删除上一次请求的缓存入口
cache.remove('http://example.com/api.users.json');
// 重新开始并移除全部缓存
cache.removeAll();

        var cache = $cacheFactory.get('$http');if(cache.get('cacheData')){console.log(cache.get('cacheData'));}else{helloService.play().then(function (data) {cache.put("cacheData", data);  //往缓存中放入数据console.log(data);});}

3.2 自定义缓存

有时候能够对缓存有更多的控制以及针对缓存的表现创建规则,这就需要创建一个新的缓存来使用 $http 请求。

通过自定义的缓存来让 $http 请求发起请求很简单。可以采用传递缓存实例的方式,而不必传递一个布尔参数 true 给请求。

var myCache = $cacheFactory('myCache');
$http({method: 'GET',utl: '/api/users.json',cache: myCache
});

一个小demo:定义一个缓存服务,依赖注入到你要用的控制器中,直接使用

define(['angularModule'
],function(app){app.factory('myCache', ['$cacheFactory', function($cacheFactory){return $cacheFactory('myCache');  //自定义一个缓存服务
    }])
});

        //自定义缓存,有缓存就从缓存里取,否则就发送请求if(myCache.get('cacheData')){console.log(myCache.get('cacheData'));}else{helloService.play(myCache).then(function (data) {myCache.put("cacheData", data);console.log(data);});}

            cache:只是为了可以使用默认$http的缓存机制play : function (myCache) {return httpRequestService.request({method : 'get',url : 'http://localhost:8080/hello/play',cache : myCache})}

现在, $http 将会使用自定义的缓存而非默认缓存。

四、为 $http 设置默认缓存

每次我们想要发起一个 $http 请求时都要给它传递一个缓存实例并不方便,特别是对每个请求使用同一缓存的时候。

其实可以在模块的 .config() 方法中通过 $httpProvider 设置 $http 默认使用的缓存对象。

angular.module('myApp', []).config(function($httpProvider) {$httpProvider.defaults.cache = $cacheFactory('myCache', {capacity: 20});
});

这个 $http 服务不再使用它为我们创建的默认缓存;它会使用我们自定义的缓存,实际上这就是一个近期缓存最久未使用算法① (Least Recently Used,LRU)。

LRU缓存根据缓存容量只保留最新的缓存数目。也就是说,我们的缓存容量为20,因此会缓存前20个请求,但是进入第21个请求时,最近最少使用的请求条目就会从缓存中被删除。这个缓存自身会负责具体哪些要维护,哪些要移除。

转载于:https://www.cnblogs.com/chaixiaozhi/p/8596738.html

angularjs 缓存详解相关推荐

  1. [面试专题]Web缓存详解

    Web缓存详解 标签(空格分隔): 缓存 缓存之于性能优化 请求更快:通过将内容缓存在本地浏览器或距离最近的缓存服务器(如CDN),在不影响网站交互的前提下可以大大加快网站加载速度. 降低服务器压力: ...

  2. MyBatis 一级缓存二级缓存详解

    相关内容: 架构师系列内容:架构师学习笔记(持续更新) MyBatis 缓存详解 cache 缓存 缓存是一般的ORM 框架都会提供的功能,目的就是提升查询的效率和减少数据库的压力.跟Hibernat ...

  3. Hibernate二级缓存详解(转)

    Hibernate二级缓存详解(转) 本文转载 http://www.blogjava.net/supercrsky/articles/238580.html 与Session相对的是,Session ...

  4. vue里页面的缓存详解

    关于vue里页面的缓存详解 实用的例子ABC 往下查看 keep-alive是vue内置的一个组件,可以使被它包含的组件处于保留状态,或避免被重新渲染. 用法: 在keep-alive标签内部添加 i ...

  5. Spring循环依赖和三级缓存详解

    Spring循环依赖和三级缓存详解 Spring在启动过程中,使用到了三个map,称为三级缓存 我们可以这样理解,假设,我们只有一个缓存容器,并且缓存是直接开放给用户可以调用的,如果将未完成赋值的Be ...

  6. cpu二级缓存和一级缓存详解及区别(图解)

    cpu二级缓存和一级缓存详解及区别(图解) 2012-09-02 12:27:55|  分类: 硬件技术 |字号 订阅 处理器缓存的传输速率确实很高,然而还不足以取代内存的地位,这主要是由于缓存只是内 ...

  7. Mybatis二级缓存详解

    Mybatis二级缓存 Mybatis相关全览 一.简介 二.一级缓存 1.入口 2.演示 案例一: 案例二: 3.总结 三.二级缓存 1.入口 2.如何开启二级缓存 cache-ref配置 cach ...

  8. MyBatis 缓存详解-开启二级缓存的方法

    第一步:在mybatis-config.xml 中配置了(可以不配置,默认是true): <setting name="cacheEnabled" value="t ...

  9. HTTP缓存详解之etag

    2019独角兽企业重金招聘Python工程师标准>>> ----------------- Apache 1.3和2.x中的ETag格式为inode-size-timestamp.即 ...

最新文章

  1. 《人类简史》八、融合统一(下)——宗教的法则、历史的混沌
  2. 在WPS中提取出的照片在哪找_WPS技巧 | 找不到合适的配图?教你一招搞定
  3. C#面试题(.net开发人员必备)
  4. 回帖整理和其他一些想法
  5. MATLAB 2018a 安装
  6. C++调用VSS API进行快照
  7. 数据分析实战(三) 因子分析模型挖掘CSDN优质博主
  8. 软件测试是不是IT行业最容易学的 ,大概需要多长时间,就业前景好吗?
  9. 如何在Pidgin中为您的域帐户设置Google Talk
  10. 如何使用小米手机对文档进行扫描
  11. I/O——Spring cache abstraction
  12. 用tushare数据自定义期货大宗商品指数(2)
  13. 浏览器安全级别怎么设置,设置浏览器安全级别的方法
  14. 区块链技术成为金融业务应用热点
  15. ardupilot python之px_uploader.py学习
  16. edge如何导入html文件收藏夹,win10系统edge浏览器收藏夹导入/导出的操作方法
  17. SLAM--VICP(Velocity Updating Iterative Closest Point Algorithm)学习笔记
  18. 单片机嵌入式二维码解码识别
  19. HDFS性能压测工具
  20. 微米级颗粒清洗新技术

热门文章

  1. unity实用技术:色盲玩家也能享受好的游戏体验
  2. 使用redis实现5万人同服的“相位技术”
  3. ubuntu服务器php7.2启用mysqli(不用reboot超简单)
  4. gc()两分钟了解JDK8默认垃圾收集器(附英文)
  5. Mysql 数据类型(整数、浮点数、定点数、字符串)【类型取值范围】
  6. oracle物理DG管理-redo数据传输,应用与三种模式
  7. 开发Windows Mobile和Wince(Windows Embedded CE)的部署项目(Deploy Project)时,如何修改注册表...
  8. 39. Combination Sum
  9. [技术博客] gitlab快速部署流程
  10. Tunnel Warfare(HDU1540+线段树+区间合并)