您的位置：首页 > Web前端 > HTML5

html5 中创建manifest缓存以及更新方法

2014-10-14 09:43 323 查看
测试环境和工具 chromium 18.0.1025.151 (开发编译版 130497 Linux) Ubuntu 11.04

一、测试内容

1.A页面manifest缓存的js文件，B页面不设manifest是否能使用缓存的js文件

2.A页面和B页面分别使用两个不同的manifest文件，但都缓存了同一个js文件，两页面更新缓存时，是否会相互影响？

3.两个页面使用同一个manifest文件，是否是共用一份缓存？

二、详细测试

1、A页面manifest缓存的js文件，B页面不设manifest是否能使用缓存的js文件 ？

先上文件

cache.html

[html] view
plaincopy

<html manifest="m.manifest">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

<script type="text/javascript" src="m.js"></script>

</head>

<body>

ver:1<p>

<input type="button" value="shwo_ver" onclick="show_ver();" /><p>

<input type="button" value="load_js" onclick="load_js();" /><p>

<input type="button" value="is_online" onclick="is_online();" /><p>

</body>

</html>

un_cache.html

[html] view
plaincopy

<html>

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

<script type="text/javascript" src="m.js"></script>

</head>

<body>

ver:1<p>

<input type="button" value="shwo_ver" onclick="show_ver();" /><p>

<input type="button" value="load_js" onclick="load_js();" /><p>

<input type="button" value="is_online" onclick="is_online();" /><p>

</body>

</html>

m.manifest

[plain] view
plaincopy

CACHE MANIFEST

# VERSION

# 直接缓存的文件dd

CACHE:

m.js

m1.js

# 需要在时间在线的文件

NETWORK:

# 替代方案

FALLBACK:

m.js

[javascript] view
plaincopy

var ver = "1";

function show_ver() {

alert(ver);

}

function load_js() {

javascript:void((function(){var e=document.createElement('script');e.setAttribute('src','m1.js');document.body.appendChild(e);})())

}

function is_online() {

alert(navigator.onLine);

}

测试方法：

分别访问cache.html和un_cache.html, 查看js版本都是为“1”.

然后修改m.js的版本为“2”.

刷新两个页面再次查看，cache.html显示为“1”， 而un_cache.html显示为“2”

测试结论：manifest建立的缓存文件，不会被没有manifest的页面读取。

2.A页面和B页面分别使用两个不同的manifest文件，但都缓存了同一个js文件，两页面更新缓存时，是否会相互影响？

新增两个文件

cache1.html

[html] view
plaincopy

<html manifest="m1.manifest">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

<script type="text/javascript" src="m.js"></script>

</head>

<body>

ver:1<p>

<input type="button" value="shwo_ver" onclick="show_ver();" /><p>

<input type="button" value="load_js" onclick="load_js();" /><p>

<input type="button" value="is_online" onclick="is_online();" /><p>

</body>

</html>

m1.manifest

[plain] view
plaincopy

CACHE MANIFEST

# VERSION

# 直接缓存的文件dd

CACHE:

m.js

m1.js

# 需要在时间在线的文件

NETWORK:

# 替代方案

FALLBACK:

测试方法：

改动一下两个manifest文件，访问cache.html和cache1.html,确保都建立新缓存，并且显示js版本号一致；

修改m.js的版本号，并改动一下m.manifest文件；

刷新cache.html和cache1.html，并再次查看js版本号，发现cache.html的版本号变了，但cache1.html的版本号没有变化。

测试结论：不同manifest文件的缓存，不会相互之间有影响

3.两个页面使用同一个manifest文件，是否是共用一份缓存？

新增cache2.html代码完全同cache.html.

测试方法：

访问cache.html和cache2.html，并确保都是显示最新js版本“4”；

修改js版本为“5”，并改动没m.manifest文件；

刷新cache.html，显示js版本为“5”；

修改js版本为“6”， 然后刷新cache2.html，显示js版本为“5”，而不是“6”.

测试结论：同一manifest文件的缓存只有一份，被多个页面使用时也是如此

三、总结

通过以上测试，我们有理由可以这么认为：一个manifest文件会创建一份缓存，不同的manifest文件其缓存的内容是互不干扰的。这些特性应该有相关文档说明的，但可惜我没有找到有，若大家找到有，请分享给我一下
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航