小程序数据缓存机制应用实现

2025-07-02 11:33:35

小程序数据缓存相关知识

数据缓存：缓存数据，从而在小程序退出后再次打开时，可以从缓存中读取上次保存的数据，常用的数据缓存API如下表所示：

注意：将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。除非用户主动删除或因存储空间原因被系统清理，否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB，所有数据存储上限为 10MB。

参数

详细参数请见
https://developers.weixin.qq.com/miniprogram/dev/api/storage/wx.setStorage.html

保存数据缓存

// 保存数据缓存
wx.setStorage({
  key: 'key',			// 本地缓存中指定的key
  data: 'value',		// 需要存储的内容（支持对象或字符串）
  success: res => {},   // 接口调用成功的回调函数
  fail: res => {}		// 接口调用失败的回调函数
})

获取数据缓存

// 获取数据缓存
wx.getStorage({
  key: 'key',			// 本地缓存中指定的 key
  success: res => {		// 接口调用成功的回调函数
    console.log(res.data)
  },
  fail: res => {}		// 接口调用失败的回调函数
})

示例：在onLoad中存入并获取

// pages/test/test.js
Page({
  onLoad: function(options) {
    // 保存数据缓存
    wx.setStorage({
      key: 'key', // 本地缓存中指定的key
      data: 'value', // 需要存储的内容（支持对象或字符串）
      success: res => {
        // 获取数据缓存
        wx.getStorage({
          key: 'key', // 本地缓存中指定的 key
          success: res => { // 接口调用成功的回调函数
            console.log(res.data)
          },
          fail: res => { } // 接口调用失败的回调函数
        })
      }, // 接口调用成功的回调函数
      fail: res => {} // 接口调用失败的回调函数
    })
  }
})

到此这篇关于小程序数据缓存机制应用实现的文章就介绍到这了,更多相关小程序数据缓存内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

微信小程序开发之数据存储参数传递数据缓存

微信小程序开发内测一个月.数据传递的方式很少.经常遇到页面销毁后回传参数的问题,小程序中并没有类似Android的startActivityForResult的方法,也没有类似广播这样的通讯方式,更没有类似eventbus的轮子可用. 现在已知传递参数的方法只找到三种,先总结下.由于正处于内测阶段,文档也不是很稳定,经常修改,目前尚没有人造轮子. 先上GIF: 1.APP.js 我把常用且不会更改的参数放在APP.js的data里面了.在各个page中都可以拿到var app = getApp(
小程序清理本地缓存的方法

1.wx.clearStorage接口函数,这个函数不需要参数,可以清理本地的所有缓存. 清除前: 清除后: 2.wx.clearStorageSync接口函数,这个函数用于同步清理本地数据缓存,该接口同样也没有参数. 清除前: 清除后: 3.wx.removeStorage接口函数:这个接口函数用于从本地缓存中异步删除指定key对应内容清除前: 清除后: 4.wx.removeStorageSync接口函数:这个函数用于从本地缓存中同步删除指定key对应的内容清除前: 清除后: 以上就是本
微信小程序本地缓存数据增删改查实例详解

微信小程序本地缓存数据增删改查实例详解数据如: var user = { name: 'Lion', sex: 'guy' } CRUD: // 添加 wx.setStorageSync('user', user); // 查询 var developer = (wx.getStorageSync('user') || []); // 更改 developer.name = 'Lion01'; wx.setStorageSync('user', user); // 删除 wx.removeSt
微信小程序-详解数据缓存

每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorage(wx.setStorageSync).wx.getStorage(wx.getStorageSync).wx.clearStorage(wx.clearStorageSync)可以对本地缓存进行设置.获取和清理.本地缓存最大为10MB. 注意: localStorage 是永久存储的,但是我们不建议将关键信息全部存在 localStorage,以防用户换设备的情况. wx.setStorage(OBJECT) 将数据存储
微信小程序实现写入读取缓存详解

在小程序中有些需要把数据缓存到Storage中,需要的时候在读取缓存中的数据,在微信小程序中通过setStorage写入数据: wx.setStorage({ key: 'myData', data: res.data.data }) 通过getStorage读取缓存中的数据: var that = this; wx.getStorage({ key: 'myData', success: function (res) { var myData = res.data;//读取key值为myDat
微信小程序如何修改本地缓存key中单个数据的详解

最近在做教师评教系统,有一个'个人信息'页面中有个编辑修改邮箱的功能,本来想得很简单,结果进坑了,搞了好久才出来. 我想实现的效果是点击下图左侧邮箱,然后进入右侧页面,进行邮箱的修改,点击提交后跳转到左侧页面,同时邮箱也发生改变. 点击'我的'时,我让它从控制台打印出student缓存中传过来的数据,如下: {no: "1635050601", name: "张三", sex: "", email: "123@qq.com",
IOS中微信小程序播放缓存的音频文件的方法

很多时候我们都想把数据预先缓存到本地,节省带宽.但是最近在处理微信小程序播放缓存到本地的音频文件的时候,遇到一些小问题,然后对于安卓和IOS需要采用不同的播放策略. 首先,如果哪怕用audio标签来播放在线的音频文件,假如服务端没有实现断点续传,IOS是无法播放的,这个需要注意. 对于缓存在小程序的音频(wx.saveFile(OBJECT)保存的音频),IOS只能通过播放背景音乐的接口播放,其它播放方法都没有成功实践,而对于安卓,内部 audio 上下文 innerAudioContext 对
微信小程序缓存（本地缓存、异步缓存、同步缓存）详解

微信小程序缓存关于本地缓存 1.wx.setStorage(wx.setStorageSync).wx.getStorage(wx.getStorageSync).wx.clearStorage(wx.clearStorageSync) 可以对本地缓存进行设置.获取和清理.本地缓存最大为10MB 2.localStorage 是永久存储一.异步缓存 wx.setStorage(OBJECT) 将数据存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容 wx.setStor
微信小程序之数据缓存的实例详解

微信小程序之数据缓存的实例详解前言: 在H5之前,缓存一般都是用cookie,但是cookie的存储空间太小.于是,H5增加了新的缓存机制,即localstorage 和 sessionstorage,具体的介绍就不在多说.在微信小程序中,数据缓存其实就和localstorage 的原理差不多,所以理解起来并不难.下面我们来一起实现一下. 效果图展示: 我们在index页面存入数字11,然后在跳转到新页面,在将缓存中的11取出渲染到当前页面.具体代码如下: index页面: <span sty
小程序数据缓存机制应用实现

小程序数据缓存相关知识数据缓存:缓存数据,从而在小程序退出后再次打开时,可以从缓存中读取上次保存的数据,常用的数据缓存API如下表所示: 注意:将数据存储在本地缓存中指定的 key 中.会覆盖掉原来该 key 对应的内容.除非用户主动删除或因存储空间原因被系统清理,否则数据都一直可用.单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB. 参数详细参数请见 https://developers.weixin.qq.com/miniprogram/dev/api/sto
微信小程序数据缓存实现方法详解

微信小程序可以通过wx.setStorage(wx.setStorageSync).wx.getStorage(wx.getStorageSync).wx.clearStorage(wx.clearStorageSync)对本地缓存进行设置.获取和清理.本地缓存最大为10MB. wx.setStorage()---------异步设置缓存微信官方给出的属性 OBJECT参数说明: 参数类型必填说明 key String 是本地缓存中的指定的 key data Object/String
详解小程序设置缓存并且不覆盖原有数据

最近在写小程序的小项目,因为是刚上手小程序,这途中遇到了许多问题,所幸在自己的坚持不懈下基本都得到了解决,今天就记录一下怎么设置缓存数据并且不覆盖吧,如果有错误的地方麻烦大家指正,互相学习一下! 这是官方的关于缓存的说明,它会覆盖掉之前的内容.我还是直接上源码吧这是writecomment.js文件 Page({ /** * 页面的初始数据 */ data: { }, submit: function (event) { var writecomment = event.detail.valu
微信小程序数据存储与取值详解

在小程序开发的过程,经常要需要这个页面输入的数据,在下一个页面中进行取值赋值. 比如: 在A页面input输入框,输入电话号码,点击添加.需要在B页面电话区域中,显示刚刚输入的电话号码. 因为这是两个页面,就需要先存储,再取值.微信小程序提供了数据存储的API,wx.setStorage(OBJECT) 可以将数据存储在本地缓存中指定的 key 中,如果重复会覆盖掉原来该 key 对应的内容. 思路是,在A页面,使用bindinput获取input输入的值,赋值给一个变量(自定义),点击添加按钮
微信小程序数据交互与渲染实例详解

微信小程序数据交互与渲染实现效果图: 微信小程序的api中提供了网络交互的api,我们只要调用即可和后端进行数据交互,该api为wx.request.,具体代码如下. //list.js //获取应用实例 var app = getApp() Page({ data: { list:[], hiddenLoading: true, url: '' }, loadList: function () { var that = this; that.setData({ hiddenLoading:
windows上利用charles抓取微信小程序数据包,手机APP数据包(HTTP与HTTPS数据包)

1.下载charles包.安装 Charles Proxy抓包工具 v4.1 破解文件 win64 附破解方法 2.关闭电脑防火墙打开控制面板,选择Windows防火墙,关了(不关很可能没法抓包,在这栽过坑) 2.连接手机 2.1 用数据线把手机连上电脑 2.2 查电脑ip,命令行输入 ipconfig 2.3 修改手机网络代理手机网络改为代理,ip为电脑ip,端口8888(charles默认端口,若被其他程序占用可修改,原则是保持电脑和手机一致) 3.安装SSL证书 (大多数app或小程序
微信小程序加载机制及运行机制图解

这篇文章主要介绍了微信小程序加载机制及运行机制图解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下一.运行机制冷启动指的是重新启动,热启动指的是5分钟内从后台切换到前台,只有冷启动才能加载最新的包. 小程序什么时候会关闭? 5min后台运行,连续收到两次(2s)系统告警. 二.加载机制三.小程序的应用生命周期四.小程序页面的生命周期分类: 小程序以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们.
PHP配合fiddler抓包抓取微信指数小程序数据的实现方法分析

本文实例讲述了PHP配合fiddler抓包抓取微信指数小程序数据的实现方法.分享给大家供大家参考,具体如下: 这两天研究了下微信指数这个东西.要抓取呢,按照一般思路的话,那就是使用fiddler抓取手机包,然后进行分析获取地址然后请求就可以了. 这么想你是没错,如果你果断这么做了,那就是too yang too simple了.大家可以看下,微信抓取有以下几个步骤: 1.开始登陆小程序 2.获取访问需要的令牌 3.那这令牌去获取数据首先的难点就是小程序的登陆那一步.你得先登陆了微信之后才可以访

小程序数据缓存机制应用实现

小程序数据缓存相关知识

相关推荐

随机推荐