微信小程序本地?cái)?shù)據(jù)緩存

發(fā)布時(shí)間：2021-06-17 10:13 所屬欄目：小程序開發(fā)教程

本地?cái)?shù)據(jù)緩存是小程序存儲在當(dāng)前設(shè)備上硬盤上的數(shù)據(jù)，本地?cái)?shù)據(jù)緩存有非常多的用途，我們可以利用本地?cái)?shù)據(jù)緩存來存儲用戶在小程序上產(chǎn)生的操作，在用戶關(guān)閉小程序重新打開時(shí)可以恢復(fù)之前的狀態(tài)。我們還可以利用本地緩存一些服務(wù)端非實(shí)時(shí)的數(shù)據(jù)提高小程序獲取數(shù)據(jù)的速度，在特定的場景下可以提高頁面的渲染速度，減少用戶的等待時(shí)間。

讀寫本地?cái)?shù)據(jù)緩存

　　小程序提供了讀寫本地?cái)?shù)據(jù)緩存的方法：

通過wx.getStorage/wx.getStorageSync讀取本地緩存。
通過wx.setStorage/wx.setStorageSync寫數(shù)據(jù)到緩存

　　其中Sync后綴的接口表示是同步接口。

說明：

　　同步是一旦開始執(zhí)行服務(wù)A后就必須等到返回結(jié)果才會繼續(xù)執(zhí)行后面的服務(wù)。

　　異步是開始執(zhí)行服務(wù)A后會另起一個(gè)線程繼續(xù)執(zhí)行后續(xù)服務(wù)，服務(wù)A執(zhí)行完后系統(tǒng)會再回來處理結(jié)果。

　　示例代碼和參數(shù)說明如下所示。

異步讀取本地緩存

1
2
3
4
5
6
7
8
9
10
11

wx.getStorage({
  key: 'key1',
  success: function(res) {
    // 異步接口在success回調(diào)才能拿到返回值
    var value1 = res.data
  },
  fail: function() {
    console.log('讀取key1發(fā)生錯(cuò)誤')
  }

})

同步讀取本地緩存

1
2
3
4
5
6

try{
  // 同步接口立即返回值
  var value2 = wx.getStorageSync('key2')
}catch (e) {
  console.log('讀取key2發(fā)生錯(cuò)誤')
}

　　表4-4 wx.getStorage/wx.getStorageSync詳細(xì)參數(shù)

寫本地緩存

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// 異步接口在success/fail回調(diào)才知道寫入成功與否
wx.setStorage({
  key:"key",
  data:"value1"
  success: function() {
    console.log('寫入value1成功')
  },
  fail: function() {
    console.log('寫入value1發(fā)生錯(cuò)誤')
  }
})

try{
  // 同步接口立即寫入
  wx.setStorageSync('key', 'value2')
  console.log('寫入value2成功')
}catch (e) {
  console.log('寫入value2發(fā)生錯(cuò)誤')
}

　　表4-5 wx.setStorage/wx.setStorageSync詳細(xì)參數(shù)

緩存隔離與限制

　　小程序宿主環(huán)境會管理不同小程序的數(shù)據(jù)緩存，不同小程序的本地緩存空間是分開的，每個(gè)小程序的緩存空間上限為10MB，如果當(dāng)前緩存已經(jīng)達(dá)到10MB，再通過wx.setStorage寫入緩存會觸發(fā)fail回調(diào)。

　　小程序的本地緩存不僅僅通過小程序這個(gè)維度來隔離空間，考慮到同一個(gè)設(shè)備可以登錄不同微信用戶，宿主環(huán)境還對不同用戶的緩存進(jìn)行了隔離，避免用戶間的數(shù)據(jù)隱私泄露。

　　由于本地緩存是存放在當(dāng)前設(shè)備，用戶換設(shè)備之后無法從另一個(gè)設(shè)備讀取到當(dāng)前設(shè)備數(shù)據(jù)，因此用戶的關(guān)鍵信息不建議只存在本地緩存，應(yīng)該把數(shù)據(jù)放到服務(wù)器端進(jìn)行持久化存儲。