1、 环境
Tomcat7.0.24+firefox12.0+eclipse(java ee版本)
2、 W3C离线应用介绍
http://dev.w3.org/html5/spec/offline.html
3、 编写测试网页(四个文件index.html、clock.css、clock.js、clock.appcache)
index.html
<!-- clock.html -->
<!DOCTYPE HTML>
<html manifest="clock.appcache">
<head>
<meta http-equiv="pragma" content="no-cache">
<title>Clock</title>
<script src="clock.js"></script>
<link rel="stylesheet" href="clock.css">
</head>
<body>
<p>The time 2 is: <output id="clock"></output></p>
</body>
</html>
clock.css
output { font: 6em sans-serif; }
clock.js
setTimeout(function (){
document.getElementById('clock').value = new Date();
}, 1000);
clock.appcache(该文件是关键,描述了需要离线应用保存的文件)
CACHE MANIFEST
CACHE:
index.html
clock.css
clock.js
4、 服务器搭建配置
在web.xml中添加
<mime-mapping>
<extension>appcache </extension>
<mime-type>text/cache-manifest</mime-type>
</mime-mapping>
不加这一步的话,传输的时候不会指明是离线应用类型firefox无法识别只会正常缓存而不会离线存储。
将代码放入webapps中
启动tomcat服务器
5、 执行访问localhost:8080//Test_Offline (Test_Offline是你的工程名,视个人建工程名而异)
关闭TOMCAT服务器,清掉火狐的缓存,访问网址离线工作正常。
本文示例代码下载地址:
tomcat7下部署的firefox中配置离线应用搭建相关代码
参考文档:
http://blog.sina.com.cn/s/blog_454fbf740100zq46.html