3

我使用 HTML5 离线存储

我的 Index.html 页面

<!DOCTYPE html>
<html lang="en" manifest="/offline-cache.manifest">

<head>
    <meta charset="utf-8">
    <title>HTML5 offline code demo</title>  
</head>
<body>
       <div id="content">
        <img src="http://increaserss.com/wp-content/uploads/flickr-rss.jpg" alt="img to be cached" />
       </div>

</body>
</html>

离线缓存.manifest 文件

CACHE MANIFEST
#just want to cache that remote image only
http://increaserss.com/wp-content/uploads/flickr-rss.jpg

我的 htaccess

RewriteEngine On
AddType text/cache-manifest .manifest

在第一次使用互联网加载页面然后禁用互联网并尝试访问此 index.html 后，缓存工作正常，但如果我再次点击 f5，图像不会显示（只有 alt 文本），当我点击url 栏并按回车键（好像是一个新请求）它工作正常......有什么方法可以维持页面刷新的缓存（f5）？

4

2 回答 2

1

我将首先验证您是否可以提取不在服务器上的资产然后缓存它们？我在想您可能会模糊浏览器缓存和 HTML 5 应用程序缓存之间的界限？

我还要确保您没有使用 Internet Explorer，因为它不支持离线缓存。

缓存清单还应在 CACHE MANIFEST 标头之后包含版本号（例如 # 版本 1.4），并且缓存文件应位于 CACHE: 标头下。例如。

CACHE MANIFEST
# version 1.4

CACHE:
images/flickr-rss.jpg

请告诉我们你是怎么做出来的。

于 2012-02-15T15:29:44.603 回答
0

您使用的是完整 URL，图像不在同一服务器上吗？如果是这样，那可能会阻止它被缓存。如果您使用的是 Chrome，它会向控制台报告缓存事件。

于 2012-02-16T03:48:59.330 回答