有没有办法同时使用CDN（针对jQuery）和HTML5应用程序缓存（通过HTML5清单）来实现离线Web应用程序？

Question

有没有办法同时使用CDN（针对jQuery）和HTML5应用程序缓存（通过HTML5清单）来实现离线Web应用程序？

jqueryhtmlmanifestcdnoffline-browsing

15

我开始研究HTML5的离线Web应用程序能力。

一段时间以前，我发现使用CDN对我的应用程序很有效，因此我一直在使用它们，主要是为了jQuery。

然而，似乎清单文件不允许缓存跨域资源。

目前，我正在使用相关Dive Into HTML5教程中描述的通用清单。我的jQuery类似于HTML5 Boilerplate中定义的方式引入。

我想继续为在线用户从CDN提供jQuery，但也许可以为离线访问缓存本地副本。

是否值得尝试这种方法，或者我应该只切换到为所有请求从我的站点提供jQuery？

谢谢。

- James Skemp

如果这些答案中的任何一个回答了您的问题，您应该接受它。 - gabe

3个回答

3

如何检查在线 jQuery 是否存在，如果不存在则从本地加载的路径在此处得到了答案：How to load local script files as fallback in cases where CDN are blocked/unavailable?

其中讨论了几种不同的方法。

个人比较喜欢 html5boilerplate 的方法：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.4.2.js"%3E%3C/script%3E'))</script>

您可以使用Modernizer检查浏览器是否支持离线缓存。 http://www.modernizr.com/ Modernizer 2.0版本支持条件加载，因此您可以使用以下脚本（摘自diveintohtml5）检测并加载所需资源：

    if (Modernizr.applicationcache) {
  // window.applicationCache is available!
} else {
  // no native support for offline :(
  // maybe try Gears or another third-party solution
}

但是正如我之前所说，我更喜欢使用html5boilerplate方法。

- alonisser

0

经过数周的思考，今晚在开车回家的路上我终于有了一个想法。

可以检查浏览器是否支持离线。然后您可以有一个区域，询问用户是否要为应用程序启用离线支持。如果他们这样做，您将加载本地副本的jQuery。如果不支持离线或离线支持不可用，则只需从CDN引用jQuery。

或者它是应用程序中的单独页面。如果他们访问它，它只是具有拉取本地jQuery文件的脚本元素的脚本元素。然后页面要么返回一个，要么关闭窗口，具体取决于应用程序。（我认为在主页面添加本地jQuery副本不起作用，除非您从现有页面中删除jQuery（覆盖变量或其他方式？））

根据浏览器如何决定保留离线内容（文件），如果仅在一个页面上加载本地jQuery文件，并且很少使用，可能会存在问题。当然，在用户离线时，每个页面都可能调用它。

- James Skemp

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- KimKha · Accepted Answer

实际上，您可以编写包含到您的jQuery CDN链接的清单文件。就像我的app.manifest一样：

CACHE MANIFEST
# 2012-01-20:v4

http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

以下是HTML片段：

<html manifest="app.manifest">
<head>
    ....
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    ....
</body>
</html>

它对我有用。