小程序模板網(wǎng)

微信小程序開發(fā)本地數(shù)據(jù)緩存教程

發(fā)布時間:2021-05-31 14:14 所屬欄目:小程序開發(fā)教程

本地數(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ā)生錯誤\')

}

width=700

寫本地緩存

// 異步接口在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ā)生錯誤\')
}

width=700

緩存隔離與限制

小程序宿主環(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ù)器端進行持久化存儲。

前端頁面處理

width=700

提交時保存數(shù)據(jù)

width=700

頁面初始化時執(zhí)行渲染

width=700


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://m.u-renovate.com/wxmini/doc/course/25861.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點擊咨詢
QQ在線咨詢
AI智能客服 ×