首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏前端大白专栏

    HTML5离线缓存技术

    原理和环境 如上面提到的HTML5离线存储是基于一个新建的.appcache文件的,通过这个文件上的解析清单离线存储资源,这些资源就会像cookie一样被存储了下来。 之后当网络在处于离线状态下时,浏览器会通过被离线存储的数据进行页面展示。 就像cookie一样,html5离线存储也需要服务器环境。 DOCTYPE html> <html lang="en" manifest="demo.appcache"> <head> <meta charset="UTF-8"> <title>HTML5离线存储 缓存立即执行 我们的产品已经更新了用户却要第二次进来才能够看到,这样用户体验也太差了吧,有什么方式能够解决呢?好在html5给javascript提供了相关的API。 注意事项 站点离线存储的容量限制是5M 如果manifest文件,或者内部列举的某一个文件不能正常下载,整个更新过程将视为失败,浏览器继续全部使用老的缓存 引用manifest的html必须与manifest

    4.4K70发布于 2018-06-15
  • 来自专栏前端博客

    html5离线缓存manifest详解

    App,同时Web App中一部分资源并不是经常改变,并不需要每次都向服务器发出请求,出于这些原因,HTML5提出的一个新的特性:离线存储。  HTML5引入了应用程序缓存(Application Cache),通过创建manifest文件可以轻松地创建Web应用的离线版本,使Web应用可以在没有网络的时候任然可以访问。 Manifest的优点离线浏览 – 用户可在应用离线时使用它们提升速度 – 已缓存资源加载得更快减少服务器负载 – 浏览器将只从服务器下载更新过或更改过的资源。 v=1.5.2 NETWORK: views/login.html对于HTML5离线存储对象window.applicationCache有几个事件需要我们关注下:oncached:当离线资源存储完成之后触发这个事件 /en-US/docs/Web/HTML/Using_the_application_cachehttp://diveintohtml5.info/offline.html转载本站文章《html5离线缓存

    3.1K31编辑于 2023-05-07
  • 来自专栏ascii0x03的安全笔记

    HTML5离线缓存攻击测试

    正常访问页面如下图所示,在离线时也能够正常刷新出来。 ? 攻击者由安装有XAMPP服务器的桥接虚拟机表示,IP为192.168.1.154。 通过两次更新manifest文件,让用户缓存恶意页面并使其manifest文件与合法网站保持一致,如图所示。 ? 通过Wireshark抓包可以看到,浏览器仅仅请求了demo_html.appcache,离线缓存攻击成功。注意在实验时需要排除浏览器本身缓存的影响,仅仅刷新页面会收到服务器返回的304响应。 由于时间有限,并没有用爬虫去找使用了HTML5离线缓存的网站,仅仅做了这种攻击的验证实验,若有大家可以推荐几个来测试。 主页htm: <! p id="timePara"><button onclick="getDateTime()">提交</button>

    这是攻击者的页面,点击出现hacked


    离线的状态下重新载入这个页面

    2.1K90发布于 2018-04-12
  • 来自专栏王二麻子IT技术交流园地

    H5离线缓存技术

    离线存储可以将站点的一些文件存储在本地,它是浏览器自己的一种机制,将需要的文件缓存下来在没有网络的时候可以访问到缓存的对应的站点页面,包括html,js,css,img等等文件在有网络的时候,浏览器也会优先使用已离线存储的文件 HTML5离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术),通过这个文件上的解析清单离线存储资源;把需要离线存储在本地的文件列在一个manifest配置文件中。 Manifest 的特点 离线浏览:即当网络断开时,可以继续访问你的页面。 访问速度快:将文件缓存到本地,不需每次都从网络上请求。 下面的例子中,如果无法建立因特网连接,则用 "404.html" 替代 /html5/ 目录中的所有文件。 html5中引入了js操作离线缓存的方法,可以通过js代码手动更新本地缓存

    1.3K20编辑于 2023-07-18
  • 来自专栏ascii0x03的安全笔记

    HTML5离线缓存攻击测试(二)

    经过昨天的测试,发现使用离线缓存的网站会被攻击。但是,不使用离线缓存的网站就真的不会受到这样的攻击么? (很郁闷相同的操作为啥有时候结果不一样,不过大部分还是造成了离线缓存攻击的效果。) 再次请求时抓包如下图,发现请求appcache文件后,尽管百度返回了302的错误页,但是浏览器没有跳转,仍然保持了离线缓存的页面,实现了缓存中毒的效果。 不知道使用https进行离线缓存攻击会不会成功。 ? 除了百度和支付宝,还用网易的126.com做了实验。 个人认为,对于类似百度网站这样的服务器设置,会导致缓存攻击成功,感觉是浏览器实现时的一个bug。如果支付宝https能被离线缓存攻击,那么危害性还是很大的。

    2.3K60发布于 2018-04-12
  • 来自专栏hrscy

    iOS离线缓存

    离线数据的方法选择 plist文件 Document路径 数据库 由于保存的是大批量数据,且会不停的刷新新数据,因此应该选择数据库来存储。使用数据库可以快速地进行数据的读取操作。 1.设计思路 如下图,说明了离线缓存的流程: ? 离线缓存 当第一次打开app的时候,把从服务器获取到的数据保存到沙盒中; 当下一次进入app的时候,首先从沙盒中找,如果沙盒中保存了之前的数据,则显示沙盒中的数据; 如果没有网络,直接加载保存到沙盒中的数据 示例 下面使用一个示例程序来介绍离线缓存。示例程序用到的框架有FMDB,SDWebImage,AFNetworking,数据是由聚合数据提供的开放API。 //img.juhe.cn/cookbook/s/10/1001_b04cddaea2a1a604.jpg", "step": "3.锅中放适量油,烧至5成热

    2K20发布于 2018-08-30
  • 来自专栏cnblogs

    http缓存离线缓存

    缓存头部 通用缓存、条件缓存缓存控制三大类 头部名称 说明 请求/响应 通用缓存头部 控制客户端是否向服务器发送请求或者是服务端响应请求 cache-control 用于随报文传递的缓存提示 pragma last-Modified的时间,让服务器验证,资源没有修改则是304 请求 If-Unmodified-Since 若last-Modified没有匹配上,返回412(预验证失败) ETag 服务器响应时将文本的md5值跟随此头发送到客户端 If-Unmodified-Since:不会响应412的情况 last-Modified值匹配成功 服务器需要响应2XX或412之外的状态码 请求发送过来的时间格式不对 二、浏览器离线缓存 实现离线缓存的步骤 检查中 3 下载中 4 更新就绪 5 缓存过期       5.2 事件 事件名 说明 checking 正在检查 downloading 正在下载 updatereadey 更新完成 obsolete ,浏览器直接清理缓存是无效的 6.3 修改main.appcache文件任何内容,都会导致离线缓存重新加载,包含注释信 6.4 引入main.appcache文件的html文件,会直接被离线缓存 6.5

    1.8K70发布于 2018-01-17
  • 来自专栏向治洪

    android离线缓存技术

    离线缓存是指在有网络的状态下将从服务器获取的网络数据,如Json 数据缓存到本地,在断网的状态下启动APP时读取本地缓存数据显示在界面上,常用的APP(网易新闻、知乎等等)都是支持离线缓存的,这样带来了更好的用户体验 如果能够在调用网络接口后自动缓存返回的Json数据,下次在断网状态下调用这个接口获取到缓存的Json数据的话,那该多好呢?Volley做到了这一点。 ,Volley只缓存了接口路径,并没有缓存接口的传入参数,因此如果做分页查询的话,使用此方法是不妥的。  2.在测试过程中,依然发现有的时候获取不到缓存数据,有的时候却可以获取到。对获取缓存的代码延迟加载能够有效解决这个问题。  3.如果考虑到缓存的过期策略,可以使用更好的ASimpleCache框架辅助开发。对缓存有更高要求的APP,依然应该使用文件缓存或数据库缓存。 源代码下载

    2.4K90发布于 2018-02-01
  • 来自专栏云计算linux

    HTMT 离线缓存机制

    /a>

    HTML5

    HTML标准自1999年12月发布 html4.0以来,后继的html5和其他标准被束之高阁,为了推动web标准化运动的发展,一些 公司联合起来,成立了一个WEB hypertext Application的组织,html5

    HTML5的第一份正式草案已于2008年1月22日公布。HTML5有两大特点:首先强化了WEB网页的表现性能。 > 通过反复切换Apache 2.2服务器,可以看到离线存储的效果。 注意如果缓存文件不存在也不会成功。切记!!!

    17000编辑于 2024-12-17
  • 来自专栏ShaoYL

    iOS---数据离线缓存

    离线缓存 为了用户的体验,不需要每次打开App都加载新数据,或者重新请求数据,因此需要把每次浏览的数据保存起来,当下次打开软件时,首先从沙盒中加载数据;或者当软件未联网时,也只能从沙盒中加载旧数据。 离线数据的方法选择 1.plist文件 2.Document路径 3.数据库 由于保存的是大批量数据,且会不停的刷新新数据,因此应该选择数据库来存储。 离线缓存的思路 当第一次打开应用程序时,把界面加载好的数据保存到沙盒中 当下一次进入应用程序时,首先从沙盒中找 如果没有网络,直接加载上次保存的数据,或者没有比较新的数据也从沙盒中加载数据。 需要缓存的数据如何保存 sqlite3 框架FMDB 操作数据库的工具类 static FMDatabase *_db; + (void)initialize { // 1.打开数据库 INSERT INTO t_status(status, idstr) VALUES (%@, %@);", statusData, status[@"idstr"]]; } } 从数据库中取出缓存数据

    1.4K120发布于 2018-05-11
  • 来自专栏IMWeb前端团队

    PWA之离线缓存(一)

    离线缓存 :通过Service Worker使得 Web App 也可以做到像 Native App 那样可以离线使用、消息推送的功能。 利用它,我们可以拦截页面请求,缓存文件。 event.waitUntil( caches.open("static-v1").then(cache => cache.add("https://7.url.cn/fudao/pc/bd3fa67732209940a5ca1db12970e41e.png 如果都缓存成功,那么OK,service worker安装成功。 这里缓存资源时, 定义了一个缓存名字static-v1 , 打开这个缓存,将图片文件添加进去。 离线资源更新 1、如果业务的静态资源更新了, 需要修改sw.js文件,一个B的修改都会引起浏览器的重新下载sw文件, 然后触发install , 装载新的离线资源。

    2.4K21发布于 2019-12-03
  • 来自专栏YuanXin

    Service Worker离线缓存实战

    背景介绍 最近实战了 Service Worker(以下简称“sw”)来进行网站缓存,以实现离线状态下,网站仍然可以正常使用。 尤其对于个人博客这种以内容为主体的静态网站,离线访问和缓存优化尤其重要;并且 Ajax 交互较少,离线访问和缓存优化的实现壁垒因此较低。 上方的代码顺便清理了旧版本的缓存。 资源拦截 在代码的最后,需要监听 fetch 事件,并且进行拦截。如果命中,返回缓存;如果未命中,放通请求,并且将请求后的资源缓存下来。 可以看到资源都通过 ServiceWorker 缓存加载进来了。 现在,我们打开离线模式, 离线模式下照样可以访问: 最后,我们修改一下 html 的代码,并且更新一下 sw.js 中标识缓存版本的变量 VERSION: 在第 2 次刷新后,通过上图可以看到,缓存版本内容已更新到

    2K10发布于 2020-04-20
  • 来自专栏全栈程序员必看

    关于离线缓存Application Cache 使用 manifest文件缓存

    如果所有资源文件都被成功下载,浏览器将会把这些资源文件以及引用manifest文件的HTML文档移动到永久离线缓存中 满满的都是坑 一些小坑 需要注意的是manifest文件放在服务器上,MIME类型必须是 manifest文件的HTML文档一并被移动到永久离线缓存中。 ),浏览器将直接从本地离线缓存中获取资源文件。 manifest文件中定义的资源文件,其实同时还缓存了iframe中的缓存页面的文档,但不会缓存主页面,修改一下主页面,并按F5刷新 Document was loaded from Application ,但依旧会从网络上加载,而iframe的解答方法也是2011~2012年左右提出的,后来就没有相关文章了,估计已经彻底失效了 Application主要是为了构建离线缓存,使得页面在离线模式下也能浏览。

    3K20编辑于 2022-07-27
  • 来自专栏鸿蒙开发笔记

    鸿蒙开发实战案例:H5页面资源离线缓存案例

    介绍在移动端 H5 应用中实现资源离线缓存是非常重要的,特别是在网络条件不稳定或用户可能在离线状态下使用应用的情况下:用户的网络连接不稳定,经常断开,但应用仍需提供可用的功能。 初次加载应用时,将所有资源下载并缓存起来,以后访问时直接从本地加载,提高加载速度。本模块结合内存缓存和磁盘缓存实现了一个H5页面资源离线缓存案例。 后续重新进入页面时,因内存和磁盘中已经存在相应资源,会直接从内存/磁盘中读取(可以通过增加版本号方式实现缓存资源更新,需开发者按照自己的业务逻辑来实现),即使在离线状态下也能快速加载页面。 实现思路指定需要缓存的资源,h5页面加载时,通过onInterceptRequest回调拦截资源加载请求,将会先检查缓存路径中是否存在对应资源若存在对应资源文件,可以自定义缓存处理逻辑,有如下多种处理: // 离线资源缓存管理| |---ResponseDataType.ets // 响应数据类型| |---WebParamsModel.ets

    53820编辑于 2025-02-26
  • 来自专栏兜兜毛毛

    MyBatis 缓存5

    跟Hibernate一样,Mybatis也有一级缓存、二级缓存,并预留了集成第三方的缓存接口。 除了基础缓存之外,MyBatis也定义了很多装饰器,同样实现了Cache接口,通过这些装饰器可以额外实现很多功能。 ? 所有缓存可以分为三大类:基本缓存、淘汰算法缓存、装饰器缓存。 策略缓存缓存达到上限时,删除最先入队的缓存 evication="FIFO" SoftCache \ WeakCache 带清理策略的缓存 通过JVM的软引用和弱引用来实现缓存,当JVM内存不足时 事务缓存 在二级缓存中使用,可一次存入多个缓存,移除多个缓存 在TransactionalCacheManager中用Map维护对应关系 一级缓存 一级缓存也叫本地缓存(Local Cache),MyBatis 而一级缓存是在SqlSession内部的,所以肯定是工作在一级缓存之前,也就是只有取不到二级缓存的情况下才到一个会话中去取一级缓存。 二级缓存是在哪里维护的呢?

    67220发布于 2021-04-19
  • 来自专栏一个执拗的后端搬砖工

    springboot(5)--缓存

    它具有内存和磁盘存储,缓存加载器,缓存扩展,缓存异常处理程序,一个gzip缓存servlet过滤器,支持REST和SOAP api等特点。 Object queryUser(@PathVariable("id") Long id) { return this.userService.findById(id); } } 5. springboot2.0.5依赖的基础库是spring5.x,而spring5中已经取消了对guava缓存的支持。 1.添加caffeine依赖 <! spring.cache.caffeine.spec=initialCapacity=50,maximumSize=500,expireAfterWrite=100s,refreshAfterWrite=5s : @Configuration public class CaffeineConfiguration { /** * 必须要指定这个Bean,refreshAfterWrite=5s

    67110发布于 2020-11-19
  • 来自专栏ChenYFanの小窝

    不只是离线缓存! - 论如何善用ServiceWorker

    离线访问可达性】。 实际上,SW确实是PWA的核心与灵魂,但SW在PWA中起的主要作用是缓存文件,提供给离线访问。并没有完整地发挥出SW的巧妙用法。 let cachelist = []; cachelist里面填写的是预缓存网址,例如在离线时返回的错误页面。 因此,对于博客的缓存,我们要保证用户每次获取都是最新的版本,但也要保证用户在离线时能看到最后一个版本的内容。 因此,针对博客来说,策略应该是先获取最新内容,然后更新本地缓存,最后返回最新内容;离线的时候,尝试访问最新内容会回退到缓存,如果缓存也没有,就回退到错误页面。

    4.4K21编辑于 2022-01-18
  • 来自专栏前端开发随记

    HTML5离线存储原理

    前言 使用HTML5,通过创建cache manifest文件,可轻松创建web应用的离线版本;HTML5引入了应用程序缓存,这意味着web应用可进行缓存,并可在没有网络时进行访问。 应用程序缓存为应用带来三个优势 离线浏览—用户可在离线时使用 速度—已经缓存的资源加载的更快 减少服务器负载—浏览器将只从服务器下载更改过的资源 原理和环境 如上面提到的HTML5离线存储是基于一个新建的 之后当网络在处于离线状态下时,浏览器会通过被离线存储的数据进行页面展示。 就像cookie一样,html5离线存储也需要服务器环境。 这种状态下.所有不在相关Cache区域出现的url都默认使用HTTP相关缓存头策略 下面的 NETWORK 小节规定文件 “login.asp” 永远不会被缓存,且离线时是不可用的: NETWORK location.reload(); //重新载入页面 }); 注意事项 站点离线存储的容量限制是5M 如果manifest文件,或者内部列举的某一个文件不能正常下载,整个更新过程将视为失败,浏览器继续全部使用老的缓存

    3.8K50编辑于 2022-12-15
  • 来自专栏Java实战博客

    5、Openresty本地缓存

    Openresty本身也支持开辟内存添加共享缓存的空间,操作api与redis一致 本地缓存的作用 减少查询redis、mysql的操作,实际redis也很快,但是毕竟有网络开销。 本地缓存会更快一些! so;;"; # ① 开启本地共享缓存,会占用内存:150mb 缓存名mycache,自定义 lua_shared_dict mycache 128m; # 在这里配置 也就是不会超时 ngx.say('缓存设定成功!') -- 读取数据 local name = getCache:get('name') ngx.say('第二次读取本地缓存!' ,name) -- 删除数据 --getCache:delete('name') -- 特别说明 -- 1、重载配置文件,缓存不会消失 -- 2、nginx重启才会删除缓存数据 特殊说明: 以上文章

    1.4K20编辑于 2022-08-24
  • 来自专栏天天

    H5缓存

    1.sessionStorage <script type="text/javascript"> var txt = document.querySelector('input'); var btns = document.querySelectorAll('button'); //存储数据 btns[0].onclick=function(){ sessionStorage.setItem('userName',txt.value); ses

    1.3K10发布于 2018-09-29
领券