动态触发 HTML5 缓存清单文件? [英] Dynamically Trigger HTML5 Cache Manifest file?
问题描述
我正在使用 HTML5 中的新缓存清单功能来缓存我的网络应用程序，以便它可以脱机工作.当页面使用以下 html 元素加载时，内容会自动缓存:
I am using the new cache manifest functionality from HTML5 to cache my web app so it will work offline. The content is cached automatically when the page is loaded with the following html element:
<html lang="en" manifest="offline.manifest">
这很好用.但是，我想让我的用户选择他们是否希望离线缓存内容.所以，这是我的问题:
This works fine. However, I want to give my users the option of whether they want the content cached offline. So, here is my question:
有什么方法可以触发应用程序在运行时缓存，使用 JavaScript，而不是在页面加载时自动完成.
Is there any way to trigger that an application be cached at runtime, using JavaScript, and not have it automatically done when the page is loaded.
例如，像这样(使用 jquery):
For example, something like this (using jquery):
----------------index.html--------------
----------------index.html--------------
<head>
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="Main.js"></script>
</head>
<body>
<button id="cacheButton">Cache Page</button>
</body>
</html>
---------Main.js---------
---------Main.js---------
$(document).ready(
function()
{
$('#cacheButton').click(onCacheButtonClick);
}
)
function onCacheButtonClick(event)
{
console.log("Setting Offline Manifest");
$('#htmlRoot').attr("manifest","offline.manifest");
}
-------------offline.manifest-------------
-------------offline.manifest-------------
CACHE MANIFEST
#version .85
#root
index.html
scripts/main.js
#jquery assets
http://code.jquery.com/jquery-1.4.4.min.js
基本上，当按钮被点击时，我动态设置了 html 元素的 manifest 属性.这有效(在元素被设置的意义上)，但它不会导致浏览器缓存页面.
Basically, when the button is clicked, I dynamically set the manifest attribute of the html element. This works (in the sense the element is set), but it does not cause the browser to then cache the page.
有什么建议吗?
推荐答案
离线缓存用了几个星期后，答案是否定的，你要么缓存，要么不缓存，在客户端设置缓存属性没有效果.
After many weeks spent with offline caching, the answer is no, you either cache or don't cache, setting the cache attribute on the client side has no effect.
您可以考虑为缓存版本提供备用网址，请注意该页面也被隐式缓存为主条目".
You could consider offering an alternate url for the caching version, be aware that the page is also implicitly cached as a "master entry".
我不知道你为什么想要离线缓存 jquery，因为它可能会在很长的期限内提供服务.
I am at a loss to understand why you would want to offline cache jquery though, since it is likely to be served with very long expiry anyway.
您可能希望考虑将离线存储作为替代方案.存储脚本的文本并在加载时将它们注入 DOM.如果没有使用 Ajax 缓存获取并注入响应，因为使用 src 创建脚本标记不会加载脚本.
You may wish to consider offline storage as an alternative. Store the text of the scripts and inject them into the DOM on load. If not cached fetch using Ajax and inject the response, as creating a script tag with the src won't load the script.
这篇关于动态触发 HTML5 缓存清单文件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
