前端巧用localStorage做“緩存”,減少HTTP請求次數
阿新 • • 發佈:2018-04-21
http請求 code 存儲 http div data ora date() ESS
場景:
載入某個頁面,JS需要通過ajax請求獲取某些數據
那麽每次刷新頁面都會有請求,如果這些數據對實時性要求並不高,顯然這樣做並不可取。
如何減少服務端的壓力,使用localStorage可以解決此問題。
//假設id是區分於其他的要儲存的k值的一部分。
var flag=0,k=null,v_arr=[],v_time=0,v=‘‘;
var cday = new Date().getDate();
var k = window.localStorage.getItem(‘name_‘+id);
if(k !== null) {
v_arr = k.split("@");
v_time = v_arr[1];
//一天過期
if(cday != v_time) {
flag = 1;
} else {
flag = 2;
v = v_arr[0];
//取到v的值,直接做該做的事情。
}
}
if(flag < 2) {
//發起請求
$.ajax(
xx,
xxx,
success:function(data) {
//存儲data有效值。
window.localStorage.setItem(‘name_‘+id,data.id+‘@‘+new Date().getDate());
//取到v的值,直接做該做的事情。
});
}
前端巧用localStorage做“緩存”,減少HTTP請求次數