2011-06-01 97 views
2

的HTML5 Offline Web application spec给出如何HTML页面懒洋洋地加载到高速缓存中的例子:延迟加载非HTML页面

CACHE MANIFEST 
FALLBACK: 
//offline.html 
NETWORK: 
* 

这在Dive Into HTML5维基百科的例子来说明:您肯定不想在网站加载时缓存整个维基百科,但您希望用户访问的任何页面都被缓存。用户在离线时访问的任何页面都应显示自定义错误页面。

这种方法的诀窍是每个HTML页面明确包括清单。任何包含清单的页面都会自动包含在缓存中,而不必明确提及。因此,此示例将从网络加载HTML页面,并将它们插入缓存中,如果处于脱机状态,则缓存中的任何页面都将工作,并且任何非缓存页面都将默认为offline.html页面。

的问题是对于非HTML文件,它没有能力包括清单。具体来说,我正在用JavaScript编写一个游戏,它有一堆音乐曲目。我有以下要求:

  • 我不希望用户必须下载的所有音乐,当游戏加载,
  • 如果用户遇到一个新的音乐曲目,同时在线,该曲目应该下载并缓存,
  • 如果用户在离线时遇到新的音乐曲目,他们是否听到沉默并不重要。
  • 如果用户遇到他们在离线时已经听到的音乐曲目,它应该从缓存播放。

是音乐文件的HTML,我可以用上面的技术,并给了他们一个manifest=...属性,让他们到缓存中的第一次加载时。但他们不是HTML,所以我不能那样做。有什么方法可以让非HTML资源在加载时保存到缓存中,但不会提前?

注:我不是很熟悉的传统的HTTP缓存机制。有可能它可以用来代替,但根据我的经验,即使浏览器缓存文件,如果浏览器处于脱机状态,它们也不起作用。如果可以这样做,我应该如何配置缓存头文件?

回答

2

这就是潜水进入HTML5说,但我找不到体现在维基百科。维基百科并没有真正以这种方式工作。在我的Chrome控制台中,找不到维基百科的任何应用程序缓存。

我想你可以试试这个:当用户完成下载音乐曲目后,通过AJAX发送这个信息到服务器。服务器应该更新这个用户的清单,并把它放入它的音乐轨道。然后,您可以拨打applicationCache.update()强制浏览器再次检查清单,它会发现更新。这意味着你不能使用静态清单文件。清单文件必须是动态的并且与用户相关。

+0

请注意,深入HTML5并不意味着维基百科会这样做;它只是将它用作可能以这种方式构建的网站的一个示例 - 如其所说的“假设的脱机启用的Wikipedia”。我觉得这个建议不会真正起作用,因为服务器会将每个用户的缓存关联起来,但我想要每个浏览器。如果用户移动到尚未下载音乐的其他设备,我不希望强制该设备下载用户看过的所有音乐。也许每个浏览器的cookie会有所帮助。尽管如此,这打破了。如果用户清除其脱机缓存。 – mgiuca 2011-06-02 04:08:46

+0

客户端是否有任何方式查询缓存并检查其中包含哪些文件?如果是这样,客户端可以在每个会话的基础上告诉服务器什么音乐文件已经被缓存,并且服务器可以发送带有这些文件的清单。这是一个肮脏的黑客攻击,但它至少允许客户端管理缓存,而不是强迫服务器记住每个客户端的缓存状态。 – mgiuca 2011-06-02 04:10:17

+0

每个浏览器和每个用户是相同的。他们都依赖cookie。 – 2011-06-02 11:33:53

1

它看起来像Mozilla有完全的解决方案,但只适用于Firefox:nsIDOMOfflineResourceList(我不知道为什么它被称为是;这些方法适用于applicationCache对象)的方法mozAddmozRemove允许你动态地使用JavaScript将对象添加到缓存。

希望成为标准的一部分(如addremove);那么这将是对这个问题的适当解决方案。