# 數(shù)據(jù)預(yù)拉取
預(yù)拉取能夠在小程序冷啟動(dòng)的時(shí)候通過微信后臺(tái)提前向第三方服務(wù)器拉取業(yè)務(wù)數(shù)據(jù),當(dāng)代碼包加載完時(shí)可以更快地渲染頁面,減少用戶等待時(shí)間,從而提升小程序的打開速度 。
# 使用流程
# 1. 配置數(shù)據(jù)下載地址
數(shù)據(jù)來源為開發(fā)者服務(wù)器時(shí)支持配置灰度比例,灰度數(shù)據(jù)下載地址可以區(qū)別于數(shù)據(jù)下載地址,灰度比例不可回退,且 100% 灰度視為更新數(shù)據(jù)地址為灰度數(shù)據(jù)地址, 如需進(jìn)行測試,可將灰度比例改為百分之 0,即只對(duì)開發(fā)者體驗(yàn)者進(jìn)行灰度。
- 登錄小程序 MP 管理后臺(tái),進(jìn)入開發(fā)管理 -> 開發(fā)設(shè)置 -> 數(shù)據(jù)預(yù)加載,點(diǎn)擊開啟
- 個(gè)人主體小程序僅支持配置云開發(fā)環(huán)境
- 非個(gè)人主體小程序支持配置HTTPS數(shù)據(jù)下載地址、 云開發(fā)環(huán)境
# 2. 設(shè)置 TOKEN
用戶登錄小程序后,小程序可以調(diào)用 wx.setBackgroundFetchToken() 設(shè)置一個(gè)自定義 TOKEN 字符串,可以跟用戶態(tài)相關(guān),TOKEN 會(huì)在下一次預(yù)拉取或周期性更新,向開發(fā)者服務(wù)器發(fā)起請(qǐng)求時(shí)帶上,便于服務(wù)器校驗(yàn)請(qǐng)求合法性。
Tips: wx.setBackgroundFetchToken 是可選接口,不是必須調(diào)用的。
示例:
App({
onLaunch() {
// 用戶登錄后
wx.setBackgroundFetchToken({
token: 'xxx'
})
}
})
# 3. 微信客戶端提前拉取數(shù)據(jù)
當(dāng)用戶打開小程序時(shí),微信服務(wù)器將向開發(fā)者服務(wù)器(上面配置的數(shù)據(jù)下載地址)發(fā)起一個(gè) HTTP GET 請(qǐng)求,其中包含的 query 參數(shù)如下,數(shù)據(jù)獲取到后會(huì)將整個(gè) HTTP body 緩存到本地。
參數(shù)中 token 和 code 只會(huì)存在一個(gè),用于標(biāo)識(shí)用戶身份。注意:如果選擇使用 code,觸發(fā)數(shù)據(jù)預(yù)拉取時(shí)可能會(huì)刷新用戶登錄態(tài),詳見 checkSessionKey。
| 參數(shù) | 類型 | 必填 | 說明 |
|---|---|---|---|
| appid | String | 是 | 小程序標(biāo)識(shí)。 |
| token | String | 否 | 前面設(shè)置的 TOKEN。 |
| code | String | 否 | 用戶登錄憑證,未設(shè)置TOKEN時(shí)由微信側(cè)預(yù)生成,可在開發(fā)者后臺(tái)調(diào)用 auth.code2Session,換取 openid 等信息。 |
| timestamp | Number | 是 | 時(shí)間戳,微信客戶端發(fā)起請(qǐng)求的時(shí)間 |
| path | String | 否 | 打開小程序的路徑。 |
| query | String | 否 | 打開小程序的query。 |
| scene | Number | 否 | 打開小程序的場景值。 |
| customMiniprogramVersion | String | 否 | 小程序版本號(hào) |
query 參數(shù)會(huì)使用?urlencode 處理
開發(fā)者服務(wù)器接口返回的數(shù)據(jù)類型應(yīng)為字符串,且大小應(yīng)不超過
256KB,否則將無法緩存數(shù)據(jù)
# 4. 讀取數(shù)據(jù)
用戶啟動(dòng)小程序時(shí),調(diào)用 wx.getBackgroundFetchData 和 wx.onBackgroundFetchData 獲取已緩存到本地的數(shù)據(jù)。
示例:
App({
onLaunch() {
wx.onBackgroundFetchData(() => {
console.log(res.fetchedData) // 緩存數(shù)據(jù)
console.log(res.timeStamp) // 客戶端拿到緩存數(shù)據(jù)的時(shí)間戳
})
wx.getBackgroundFetchData({
fetchType: 'pre',
success(res) {
console.log(res.fetchedData) // 緩存數(shù)據(jù)
console.log(res.timeStamp) // 客戶端拿到緩存數(shù)據(jù)的時(shí)間戳
console.log(res.path) // 頁面路徑
console.log(res.query) // query 參數(shù)
console.log(res.scene) // 場景值
}
})
}
})
# 調(diào)試方法
為了方便調(diào)試數(shù)據(jù)預(yù)拉取,工具提供了下面的調(diào)試能力給到開發(fā)者,具體可查看預(yù)拉取數(shù)據(jù)調(diào)試。