本地數(shù)據(jù)緩存是小程序存儲在當(dāng)前設(shè)備上硬盤上的數(shù)據(jù),本地數(shù)據(jù)緩存有非常多的用途,我們可以利用本地數(shù)據(jù)緩存來存儲用戶在小程序上產(chǎn)生的操作,在用戶關(guān)閉小程序重新打開時可以恢復(fù)之前的狀態(tài)。我們還可以利用本地緩存一些服務(wù)端非實時的數(shù)據(jù)提高小程序獲取數(shù)據(jù)的速度,在特定的場景下可以提高頁面的渲染速度,減少用戶的等待時間。
小程序提供了讀寫本地數(shù)據(jù)緩存的接口,通過wx.getStorage/wx.getStorageSync讀取本地緩存,通過wx.setStorage/wx.setStorageSync寫數(shù)據(jù)到緩存,其中Sync后綴的接口表示是同步接口,執(zhí)行完畢之后會立馬返回,示例代碼和參數(shù)說明如下所示。
讀取本地緩存
wx.getStorage({
key: \'key1\',
success: function(res) {
// 異步接口在success回調(diào)才能拿到返回值
var value1 = res.data
},
fail: function() {
console.log(\'讀取key1發(fā)生錯誤\')
}
})
try{
// 同步接口立即返回值
var value2 = wx.getStorageSync(\'key2\')
}
catch (e) {
console.log(\'讀取key2發(fā)生錯誤\')
}
寫本地緩存
// 異步接口在success/fail回調(diào)才知道寫入成功與否
wx.setStorage({
key:key,
data:value1
success: function() {
console.log(\'寫入value1成功\')
},
fail: function() {
console.log(\'寫入value1發(fā)生錯誤\')
}
})
try{
// 同步接口立即寫入
wx.setStorageSync(\'key\', \'value2\')
console.log(\'寫入value2成功\')
}catch (e) {
console.log(\'寫入value2發(fā)生錯誤\')
}
緩存隔離與限制
小程序宿主環(huán)境會管理不同小程序的數(shù)據(jù)緩存,不同小程序的本地緩存空間是分開的,每個小程序的緩存空間上限為10MB,如果當(dāng)前緩存已經(jīng)達到10MB,再通過wx.setStorage寫入緩存會觸發(fā)fail回調(diào)。
小程序的本地緩存不僅僅通過小程序這個維度來隔離空間,考慮到同一個設(shè)備可以登錄不同微信用戶,宿主環(huán)境還對不同用戶的緩存進行了隔離,避免用戶間的數(shù)據(jù)隱私泄露。
由于本地緩存是存放在當(dāng)前設(shè)備,用戶換設(shè)備之后無法從另一個設(shè)備讀取到當(dāng)前設(shè)備數(shù)據(jù),因此用戶的關(guān)鍵信息不建議只存在本地緩存,應(yīng)該把數(shù)據(jù)放到服務(wù)器端進行持久化存儲。
前端頁面處理
提交時保存數(shù)據(jù)
頁面初始化時執(zhí)行渲染