本实验采用局域网模拟，通过修改本地HOSTS文件来模拟域名以及DNS欺骗。合法网站使用Linux CentOS7的apache服务器搭建，IP为192.168.1.113，HOSTS文件中加入192.168.1.113 www.cache-test.com来模拟域名。正常访问页面如下图所示，在离线时也能够正常刷新出来。
攻击者由安装有XAMPP服务器的桥接虚拟机表示，IP为192.168.1.154。攻击者可以访问本目录的demo_html.appcache获得缓存文件，在同名文件加入自己的恶意代码（这里是弹出hacked对话框），利用DNS欺骗、中间人等方式，这里将HOSTS文件更改为192.168.1.154 www.cache-test.com来模拟。通过两次更新manifest文件，让用户缓存恶意页面并使其manifest文件与合法网站保持一致，如图所示。
接下来，修改HOSTS文件为192.168.1.113 www.cache-test.com，模拟用户已经回到了安全的上网环境下，当用户再次访问该合法网站时，仍然出现的是上述攻击者的页面。通过Wireshark抓包可以看到，浏览器仅仅请求了demo_html.appcache，离线缓存攻击成功。注意在实验时需要排除浏览器本身缓存的影响，仅仅刷新页面会收到服务器返回的304响应。
由于时间有限，并没有用爬虫去找使用了HTML5离线缓存的网站，仅仅做了这种攻击的验证实验，若有大家可以推荐几个来测试。
主页htm：
<!DOCTYPE html> <html manifest="demo_html.appcache"> <meta charset="UTF-8"> <body> <script src="demo.js"> </script> <p id="timePara"><button onclick="getDateTime()">提交</button></p> <p>这是攻击者的页面，点击出现hacked</p><br/> <p>在离线的状态下重新载入这个页面，页面也可以访问。</p> </body> </html>
demo_html.appcache：
CACHE MANIFEST
#2015-05-12
CACHE:
demo.js
demo.js:
function getDateTime() { alert('hacked!'); }