前端巧用localStorage做“快取”，減少HTTP請求次數

Love Lenka發表於2020-02-11
前端快取HTTP

場景：

載入某個頁面，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的值，直接做該做的事情。

　　　　});


}
原文連結：https://www.cnblogs.com/black-humor/p/8898212.html

相關文章