• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

微信小程序 数据预拉取

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

数据预拉取

预拉取能够在小程序冷启动的时候通过微信后台提前向第三方服务器拉取业务数据,当代码包加载完时可以更快地渲染页面,减少用户等待时间,从而提升小程序的打开速度 。

使用流程

1. 配置数据下载地址

登录小程序 MP 管理后台,进入设置 -> 开发设置 -> 数据预加载,点击开启,填写数据下载地址,只支持 HTTPS 。

2. 设置 TOKEN

第一次启动小程序时,调用 wx.setBackgroundFetchToken() 设置一个 TOKEN 字符串,可以跟用户态相关,会在后续微信客户端向开发者服务器请求时带上,便于给后者校验请求合法性。

示例:

App({
  onLaunch() {
    wx.setBackgroundFetchToken({
      token: 'xxx'
    })
  }
})

3. 微信客户端提前拉取数据

当用户打开小程序时,微信服务器将向开发者服务器(上面配置的数据下载地址)发起一个 HTTP GET 请求,其中包含的 query 参数如下,数据获取到后会将整个 HTTP body 缓存到本地。

参数类型必填说明
appidString小程序标识。
tokenString前面设置的 TOKEN。
codeString用户登录凭证,未设置TOKEN时由微信侧预生成,可在开发者后台调用 auth.code2Session,换取 openid 等信息。
timestampNumber时间戳,微信客户端发起请求的时间
pathString打开小程序的路径。
queryString打开小程序的query。
sceneNumber打开小程序的场景值。
query 参数会使用 urlencode 处理
token和code只会存在一个,用于标识用户身份。
开发者服务器接口返回的数据类型应为字符串,且大小应不超过 256KB,否则将无法缓存数据

4. 读取数据

用户启动小程序时,调用 wx.getBackgroundFetchData() 获取已缓存到本地的数据。

示例:

App({
  onLaunch() {
    wx.getBackgroundFetchData({
      fetchType: 'pre',
      success(res) {
        console.log(res.fetchedData) // 缓存数据
        console.log(res.timeStamp) // 客户端拿到缓存数据的时间戳
        console.log(res.path) // 页面路径
        console.log(res.query) // query 参数
        console.log(res.scene) // 场景值
      }
    })
  }
})

调试方法

为了方便调试数据预拉取,工具提供了下面的调试能力给到开发者。



鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序 DarkMode适配指南发布时间:2022-02-02
下一篇:
微信小程序 周期性更新发布时间:2022-02-02
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap