壹、什麽是緩存?
緩存是壹個可以透明地存儲數據的組件,以便將來可以更快地處理請求。
高速緩存可以處理的請求越多,整體系統性能的提高就越多。
第二,角狀緩存
2.1 $cacheFactory簡介
$cacheFactory是壹個為所有Angular服務生成緩存對象的服務。在內部,$cacheFactory創建了壹個默認的緩存對象,即使我們沒有顯式地創建它。
要創建緩存對象,可以使用$cacheFactory通過ID創建緩存:
var cache = $ cache factory(' my cache ');
這個$cacheFactory方法可以接受兩個參數:
CacheId (string):這個CacheId是創建緩存時的Id名稱。您可以通過get()方法使用緩存名稱來引用它。
容量:該容量描述了在任何給定時間使用緩存存儲和保存的緩存鍵值對的最大數量。
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 ");
remove all():remove all()函數用於重置緩存並刪除所有緩存的值。
destory():destory()方法用於從$cacheFactory緩存註冊表中刪除對指定緩存的所有引用。
第三,$/API . users . JSON ');
//刪除最後壹個請求的緩存條目
cache . remove('/API . users . JSON ');
//重新啟動並刪除所有緩存。
cache . remove all();var cache = $ cache factory . get(' $ http ');
if(cache . get(' cacheData '){
console . log(cache . get(' cache data '));
}否則{
helloService.play()。然後(
函數(數據){
cache.put("cacheData ",數據);//將數據放入緩存
console.log(數據);
}
);
}3.2自定義緩存
有時,您可以對緩存進行更多的控制,並為緩存的性能創建規則,這需要創建壹個新的緩存來使用$http請求。
讓$ TERM請求通過自定義緩存發起請求很容易。您可以傳遞壹個緩存實例,而無需向請求傳遞壹個布爾值參數true。
var my cache = $ cache factory(' my cache ');
$http({
方法:“GET”,
utl:“/API/users . JSON”,
緩存:我的緩存
});壹個小演示:定義壹個緩存服務,把依賴註入到妳要使用的控制器中,直接使用。
定義([
“角度模塊”
],函數(應用程序){
app.factory('myCache ',['$cacheFactory ',function($cacheFactory){
返回$ cache factory(' my cache ');//自定義緩存服務
}])
});//自定義緩存。如果有緩存,從緩存中取出,否則發送請求。
if(my cache . get(' cacheData '){
console . log(my cache . get(' cache data '));
}否則{
helloService.play(myCache)。然後(
函數(數據){
myCache.put("cacheData ",數據);
console.log(數據);
}
);
}
Cache:這樣您就可以使用默認的$http緩存機制。
播放:函數(我的緩存){
返回httpRequestService.request({
方法:“get”,
URL:' http://localhost:8080/hello/play ',
緩存:我的緩存
})
}現在,$http將使用自定義緩存,而不是默認緩存。
第四,為$http設置默認緩存
每當我們想要發起壹個$ TERM $http請求時,將緩存實例傳遞給它是不方便的,尤其是當我們對每個請求使用相同的緩存時。
事實上,您可以通過模塊的$httpProvider來設置$http默認使用的緩存對象。config()方法。
angular.module('myApp ',[])。配置(函數($httpProvider) {
$ http provider . defaults . cache = $ cache factory(' my cache ',{ capacity:20 });
});這個$http服務不再使用它為我們創建的默認緩存;它將使用我們的自定義緩存,事實上,這是壹個最近最少使用的算法(LRU)。
LRU緩存僅根據緩存容量保留最新數量的緩存。換句話說,我們的緩存容量是20,所以我們將緩存前20個請求,但是當我們輸入21請求時,最近最少使用的請求條目將從緩存中刪除。這個緩存本身將負責維護什麽和刪除什麽。
相信看完這個案例,妳已經掌握了方法。更多精彩請關註Gxl上其他相關文章!
推薦閱讀:
Jquery+fullpage在界面中添加了標題和版權。
如何使用webpack+vue環境局域網