2011-06-01 174 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);那麼這將是對這個問題的適當解決方案。