ApplicationCache离线存储..docxVIP

前段时间做了一个音乐电台的页面。美女同事录了一段10M+的MP3文件，需要做成一个图文并茂+电台音乐背景的H5页面，当时直接放根目录下用audio播放，页面上线后美女的图文介绍+治愈系声音果然引来一大票拥趸。有些用户听一遍还不过瘾，反复进入页面收听，关键是有人用的不是wifi，而是3G或4G的流量，特别是4G的，速度快，流量走得更快。因为audio的文件一旦开始播放就算中途暂停它也会把文件加载完，而且页面不会自动缓存。然后这些用户就收到了流量告急的通知，然后我就收到了投诉。当时第一反应就是怎么让浏览器把mp3文件缓存下来（现在想想可以上传到视频网站上用直播流，当时真是考虑不周到啊），于是有了对ApplicationCache的研究。关于ApplicationCache，《HTML5与CSS3权威指南》中的原话是：为了让Web应用程序在离线状态时候也能正常工作，就必须要把所有构成Web应用程序的资源，诸如HTML文件、css文件、JaveScript脚本文件等放在本地缓存中，当服务器没有和Internet建立连接的时候，也可以利用本地缓存中的资源文件来正常运行Web应用程序。ApplicationCache与浏览器网页缓存的区别与其优势区别：本地缓存为整个web提供服务，浏览器缓存只缓存单个页面；本地缓存可以指定页面、文件进行缓存，也可以通过程序控制更新，而我们无法知道浏览器缓存对哪