一. 優化小程式自身的Storage
- 小程式中的儲存只有 Storage ,特性如下:
- 上限為 10MB
- 以使用者緯度隔離,同一個裝置,A 無法訪問 B 使用者的資料。
- 持久快取,只有在使用者關掉小程式才會刪除,如果空間不足,會進行 LRU ,也就是不經常使用的小程式的資料快取區域會被全部清空。
-
在體驗版、開發版、和線上版都共用一套,並不會隔離。
-
沒有 Cookie
- 因此我們要在 Storage 中隔離一個 Cookie ,用來模擬瀏覽器中的 Cookie ,解析介面返回的 Header,設定 Cookie,在傳送介面請求前,自動帶上 Cookie。
從上面知道,storage 不會自動銷燬,而是在小程式銷燬的時候再銷燬。我們先了解一下小程式的執行機制。
小程式執行機制:
- 小程式沒有重啟的概念
- 當小程式進入後臺,客戶端會維持一段時間的執行狀態,超過一定時間後(目前是5分鐘)會被微信主動銷燬
- 置頂的小程式不會被微信主動銷燬
- 當收到系統記憶體告警也會進行小程式的銷燬
程式碼實現:
const storage = { set(){}, //設定快取 get(){}, //獲取快取 remove(){}, // 移除快取 checkAndClearExpired(){}, //將過期快取清理掉 isExpired() {} //判斷是否過期 }
在 storage 中隔離一個欄位,用來做 cookie
let cookie = (function(){ return wx.getStorageSync('cookies'); }()) const Cooke = { getCookie(){}, //從記憶體中獲取cookie setCookie(){}, // 設定cookie setCookieInHeader(){}, //根據response的Header設定cookie removeCookie() {},//刪除cookie isExpired() {} //判斷是否過期 }
在設定storage的時候,增加一個欄位 expire 用來表示過期時間。簡化程式碼如下:
function isExpired (expires) { // 小於等於現在時間為過期 if (new Date(expires) <= new Date()) { return true; } }
這樣子,整體的流程如下:
到底了,不知道是不是越來越懶了,博文寫得越來越短。。。