app内嵌H5 webview 本地缓存问题的解决


Posted in HTML / CSS onOctober 19, 2020

前文

APP内嵌H5已经很普遍了,但是每个app提供的webview表现都不太一样,在开发中遇到了一个非常棘手的缓存问题。APP启动时加载了我们商城项目的H5代码,然后把index.html文件缓存到了本地。
记录一下

问题表现

H5项目打包上线后,由于静态资源js和css文件名后面都带了哈希值,这是webpack打包带上的,也是为了=防止缓存。但是在app启动后由于缓存了html请求的还是上个版本包的静态资源,导致index.a878n.js找不到404,页面吧白屏了。-----我们H5项目打包上线后,服务器上上个版本的代码就清掉了。

解决办法

我们一开始给html加上了一段随机数,就是app加载到html时,在url后面加随机数,但是发现webview的html缓存,导致我们的js修改是更新不上的。
最后解决方案是,app端加载项目时在域名后加时间戳并升级app才可。

为了避免这种问题出现,那就是项目首次上线时就要在html内给url加上随机数,让webview不缓存html到本地。

前端大佬给推荐的是一开始就要配置nginx ,强制不缓存html

location / {
      expires -1;
      add_header 'Cache-Control' 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
      try_files $uri $uri/ @router;
      index index.html;
    }

到此这篇关于app内嵌H5 webview 本地缓存问题的解决的文章就介绍到这了,更多相关app内嵌Html5 webview 本地缓存内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3中Transform动画属性用法详解
Jul 04 HTML / CSS
CSS3 优势以及网页设计师如何使用CSS3技术
Jul 29 HTML / CSS
css3新增颜色表示方式分享
Apr 15 HTML / CSS
HTML5应用之文件上传
Dec 30 HTML / CSS
Html5 实现微信分享及自定义内容的流程
Aug 20 HTML / CSS
html特殊符号示例 html特殊字符编码对照表
Jan 14 HTML / CSS
浅谈html5 响应式布局
Dec 24 HTML / CSS
Canvas制作旋转的太极的示例
Mar 09 HTML / CSS
利用Storage Event实现页面间通信的示例代码
Jul 26 HTML / CSS
详解canvas.toDataURL()报错的解决方案全都在这了
Mar 31 HTML / CSS
html+css合并表格边框的示例代码
Mar 31 HTML / CSS
css3实现的加载动画效果
Apr 07 HTML / CSS
使用HTML5做的导航条详细步骤
Oct 19 #HTML / CSS
利用Node实现HTML5离线存储的方法
Oct 16 #HTML / CSS
HTML+CSS+JavaScript实现图片3D展览的示例代码
Oct 12 #HTML / CSS
HTML5逐步分析实现拖放功能的方法
Sep 30 #HTML / CSS
移动端HTML5 input常见问题(小结)
Sep 28 #HTML / CSS
HTML5超文本标记语言的实现方法
Sep 24 #HTML / CSS
Html5 webRTC简单实现视频调用的示例代码
Sep 23 #HTML / CSS
You might like
一步一步学习PHP(5) 类和对象
2010/02/16 PHP
php中使用Akismet防止垃圾评论的代码
2011/06/10 PHP
JS中encodeURIComponent函数用php解码的代码
2012/03/01 PHP
深入探讨<br />和 \r\n两者有什么区别??
2013/06/05 PHP
如何使用PHP批量去除文件UTF8 BOM信息
2013/08/05 PHP
PHP大转盘中奖概率算法实例
2014/10/21 PHP
php实现使用正则将文本中的网址转换成链接标签
2014/12/03 PHP
Yii框架组件和事件行为管理详解
2016/05/20 PHP
php实现评论回复删除功能
2017/05/23 PHP
从JavaScript 到 JQuery (1)学习小结
2009/02/12 Javascript
jQuery UI Autocomplete 1.8.16 中文输入修正代码
2012/04/16 Javascript
js 延迟加载 改变JS的位置加快网页加载速度
2012/12/11 Javascript
Javascript Boolean、Nnumber、String 强制类型转换的区别详细介绍
2012/12/13 Javascript
onkeyup,onkeydown和onkeypress的区别介绍
2013/10/21 Javascript
JavaScript中的toDateString()方法使用详解
2015/06/12 Javascript
微信小程序 空白页重定向解决办法
2017/06/27 Javascript
Vue中 v-if 和v-else-if页面加载出现闪现的问题及解决方法
2018/10/12 Javascript
javascript实现遮罩层动态效果实例
2019/05/14 Javascript
微信小程序开发打开另一个小程序的实现方法
2020/05/17 Javascript
利用一个简单的例子窥探CPython内核的运行机制
2015/03/30 Python
Python分治法定义与应用实例详解
2017/07/28 Python
python中datetime模块中strftime/strptime函数的使用
2018/07/03 Python
使用django的ORM框架按月统计近一年内的数据方法
2019/07/18 Python
Python3.6 + TensorFlow 安装配置图文教程(Windows 64 bit)
2020/02/24 Python
提供世界各地便宜的机票:Sky-tours
2016/07/21 全球购物
俄罗斯化妆品和香水网上商店:Iledebeaute
2019/01/03 全球购物
JAVA程序设计笔试题面试题一套
2015/07/28 面试题
总经理助理岗位职责
2013/11/08 职场文书
爷爷追悼会答谢词
2014/01/24 职场文书
《草原》教学反思
2014/02/15 职场文书
迟到检讨书范文
2015/01/27 职场文书
教师节主持词开场白
2015/05/29 职场文书
养成教育工作总结
2015/08/13 职场文书
golang 定时任务方面time.Sleep和time.Tick的优劣对比分析
2021/05/05 Golang
Python中 range | np.arange | np.linspace三者的区别
2022/03/22 Python
【海涛dota解说】一房久违的影魔魂守二连发
2022/04/01 DOTA