小程序解决图片浏览器缓存

最新推荐文章于 2024-08-01 10:26:30 发布
最新推荐文章于 2024-08-01 10:26:30 发布
阅读量1.6k 收藏
点赞数
分类专栏： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hexiaoniao/article/details/101030203
版权

小程序开发的时候碰到一个问题。接口里图片已经更新了。名称不变。小程序里就算请求了重新获取图片。setdata之后。图片依然没有变化。因为浏览器缓存。所以这里需要在图片的src里加一个时间戳或者随机数

hhtp://xx.png?12345678

这样浏览器会任何这是不同的图片。就更新了。完美解决

hexiaoniao
关注
专栏目录
微信小程序开发中的数据缓存和离线存储
2401_85258012的博客
06-02 1643
数据缓存可以通过Storage API和缓存策略来实现，可以保存和获取数据，提高小程序的性能。缓存策略通常是在请求数据时进行设置，可以选择将数据缓存到本地，以减少对服务器的请求次数，提高小程序的性能。在Service Worker的install事件中，可以调用caches.open方法打开一个缓存，并通过调用cache.addAll方法将资源文件添加到缓存中。通过调用wx.setStorage方法保存请求到的数据，然后可以通过调用wx.getStorage方法获取保存的数据，以备后续使用。
微信小程序，头像上传，图片列表上传，图片缓存机制，表单上传
07-09
直接从项目里面拿出来的代码，附带了很多其他代码可供参考，都是亲测测试通过的。里面还附带了php后端代码文件。
微信小程序图片缓存策略
code
09-01 5325
昨天，后端给我提了一个问题：他更换了CDN上的图片，但是他打开小程序来看，还是旧图片，他尝试过删除小程序，重新进，还是旧图片。 我第一反应是：“你有没有清CDN缓存？“ 他说：”我在阿里云CDN控制台刷新缓存了，都两三天了，还是旧图片。”（后来我看过刷缓存记录，一天前刚刷的，他夸张了。。。） 我说：“那不应该呀，CDN刷新缓存，5分钟就生效了。” 当即拿出我的手机，进小程序看了一下，是新的图片。 他赶紧拿出他的手机给我看，果然，不管试多少次，都是旧图片。 我说：”你这个图片是文件名没改，请求地址
微信小程序优化点实践
最新发布
ujjhuhu的博客
08-01 924
提问：我将这个方法放在组件的observers中调用，不加setTimeout，而是在function (projectItem)前加async，同时在外面使用list，wx:for同时渲染多个这个组件，假如同时渲染十个，会出现这十个中的异步都走完才会同时显示，而不是list拿到后就显示，然后图片一个一个出来，看起来就行它将这十个异步同步执行了，第一个阻塞第二个这样，这是为什么？有无大佬解释一下是什么原因？在微信小程序中，如果同一个图片资源在页面中多次使用，它只会被加载一次，并且会被缓存起来。
微信小程序 图片 缓存
^璐三岁要耍蓅氓♡
05-10 564
微信小程序访问服务器上的图片，名字一直保持一样，但是图片在服务器上已经被替换成新的了，但是微信小程序仍然使用的是缓存的图片，无法更新，这时候就添加随机数使微信小程序每次都需要从服务请求图片，而不是使用缓存中的图片。 var tempArr = [] tempArr.push(that.data.storeCode) tempArr[0] = tempArr[...
小程序实现本地图片缓存功能
qq_36683019的博客
04-22 5179
公司最近有个需求，就是我们的小程序的详情页一点开就是好几十张图片，特别浪费流量，而且不够快。于是就想，能不能把上次加载的图片存在本地，等下次打开的时候直接加载本地图片就可以了？ 事实证明是可行的。 新建一个upImg.js文件，把所有的功能都写在里面。 const fs = wx.getFileSystemManager(); //入口方法 function chekcimgstorsize(warrantyId, data) { return new Promise((resolve,
小程序/web端图片缓存问题
2202_75496303的博客
01-31 549
导致的：浏览器在加载页面后，会对页面资源进行缓存，下次打开页面会优先从缓存中读取数据，由于图片的存储路径没有发生变化，即使图片A已经被覆盖了，但浏览器缓存的数据还是图片A，所以网页上显示的图片也不会发生变化。，使浏览器认为每次加载的不是同个图片。在图片src路径后面加上。
js、css、img等浏览器缓存问题的2种解决方案
10-26
然而，随着前端技术的发展，JavaScript、CSS、图片等静态资源经常需要更新，此时，浏览器缓存就有可能成为一个问题。本文将探讨两种常见的解决浏览器缓存问题的方法。 方法一：生成随机数字 该方法通过在资源文件...
微信小程序缓存过期时间的使用详情
11-28
在微信小程序中，缓存是应用数据的一种存储方式，它能提高用户体验，减少网络请求，尤其是在用户离线或者网络状况不佳时。本文将详细介绍微信小程序的缓存过期时间的使用，以及相关API的详细说明。 1. **本地缓存**...
js、css、img等浏览器缓存问题的2种解决方案.docx
01-20
此外，还有其他方法可以解决浏览器缓存问题，例如采纳读取文件大小、文件修改时间生成 MD5 的方式自动化实现，程序自动构建时压缩合并 js 并且全局替换版本。这些方法可以根据具体情况选择使用。 浏览器缓存问题是 ...
浏览器缓存（简洁易懂）
weixin_62765236的博客
09-04 361
浏览器缓存
微信小程序服务器上获取图片保存本地源码
10-25
适合新手的小程序源码，从服务器上当图片资源，并保存到本地的项目
方便快捷的清除缓存的小程序
04-11
很小，方便快捷，对于老电脑特别适用OKOKOKOOKKOKOOKOKK
微信小程序实现图片放大预览功能
08-28
主要为大家详细介绍了微信小程序实现图片放大预览功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
图片浏览小程序(java+applet)
01-01
Java+applet实现的图片浏览小程序
微信小程序图片缓存解决办法
weixin_42177572的博客
12-04 3759
图片路径后面加上随机时间戳。
【成长记录】iOS小程序图片浏览器
独孤尤慕的专栏
03-14 449
做一个基本的图片浏览器，效果如下
微信小程序持久化存储图片文件 实现网络图片本地缓存
2301_77012836的博客
04-12 757
关于项目中需要减轻服务器资源消耗问题，前端简单对图片做缓存处理#
小程序 canvas 加载图片缓存问题
古德的博客
10-08 516
canvasToTempFilePath放到ctx.draw内。img.src放到img.onload后面。toDataURL换换其他图片类型看看。
JS获取浏览器缓存大小
06-07
可以使用 JavaScript 来获取浏览器缓存大小。具体步骤如下： 1. 首先创建一个 XMLHttpRequest 对象； 2. 通过该对象的 `open()` 方法打开一个 HEAD 请求，请求一个不存在的文件，例如： `xhr.open('HEAD', '/nonexistent-file', true);` 3. 在 `xhr` 对象上注册一个 `onload` 事件处理程序，在该事件处理程序中获取 `xhr.getResponseHeader('Content-Length')` 的值。这个值就是浏览器缓存的大小。 下面是一个示例代码： ```javascript function getCacheSize(callback) { var xhr = new XMLHttpRequest(); xhr.open('HEAD', '/nonexistent-file', true); xhr.onload = function() { var cacheSize = xhr.getResponseHeader('Content-Length'); callback(cacheSize); }; xhr.send(); } getCacheSize(function(cacheSize) { console.log('Browser cache size is ' + cacheSize + ' bytes.'); }); ``` 需要注意的是，这种方法只能获取到浏览器 HTTP 缓存的大小，而不能获取到浏览器其他类型的缓存大小，例如 IndexedDB、LocalStorage 等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值