wake-up-neo.com

HTML5 - Cache-Manifest funktioniert gut unter Chrome, aber nicht unter Firefox und Opera

Ich entwickle eine Web-App für die Offline-Verwendung. Daher muss die Cache-Funktionalität der Anwendung verwendet werden.

Alles funktioniert gut unter Chrome (15.0.874.106), aber nicht unter Firefox (7.0.1) und Opera (11.52).

Dies ist meine Cache-Manifest-Datei cache.manifest.php (ich habe sie auf das Nötigste reduziert):

<?php 
    header("Cache-Control: max-age=0, no-cache, no-store, must-revalidate");
    header("Pragma: no-cache");
    header("Expires: Wed, 11 Jan 1984 05:00:00 GMT");
    header('Content-type: text/cache-manifest');
?>CACHE MANIFEST

CACHE:

/app/common/css/reset.css
/favicon.ico

Und dies sind die ersten 4 Zeilen des "Haupt" -HTML-Dokuments:

<!DOCTYPE html> 
<html manifest="/app/mobile/cache.manifest.php"> 
    <head> 
    <title>MyApp Mobile</title> 

Wenn ich versuche, das Cache-Manifest (http://www.myapp.com/app/mobile/cache.manifest.php) in den Browser zu laden, wird die Datei korrekt angezeigt, aber wenn ich versuche, die Seite einmal offline zu laden, erhalte ich das Fehlerseite "Verbindung nicht möglich". Auch dies geschieht nur in Firefox und Opera.

Firebug sagt "0 items in offline cache" und ich konnte den Anwendungscache auf DragonFly nicht überprüfen.

Ich werde wütend und weiß nicht, wie ich das Problem unter Firefox und Opera effektiv beheben kann. Bitte helfen Sie.

Danke, Dan

22
dan

Nach meiner Erfahrung mit dem HTML5-AppCache ist es großartig, wenn es funktioniert, aber extrem spröde. Wenn das Kleinste nicht stimmt, ignoriert der Browser die gesamte Datei und lädt ärgerlicherweise alles von Grund auf neu vom Server, anstatt den normalen Cache des Browsers zu verwenden.

Schlimmer noch, Browser laden die Manifest-Datei nicht erneut es sei denn, ihr Textinhalt ändert sich. Sie können also Ihre Server-Header anpassen oder etwas ändern, um das Problem zu beheben, aber es sei denn, der Inhalt von cache.manifest.php ändert sich der Browser ignoriert ihn blind und führt genau das aus, was er zuletzt getan hat . Es könnte also kaputt gegangen sein, dann haben Sie es behoben, aber die Browser ignorieren die Änderungen, da sich der Textinhalt von cache.manifest.php nicht geändert hat. Dies scheint sogar immun gegen das Löschen des Browser-Caches zu sein, was einen Teil der Verwirrung ausmacht - der App-Cache nimmt das Cachen wirklich sehr ernst.

Um dies zu umgehen, werden Textänderungen in Kommentaren gezählt. Geben Sie daher oben einen Kommentar mit einer Version oder einem Zeitstempel oder dem Datum (z. B. # Version 1.2) an und ändern Sie diesen, wenn der Browser dies "bemerken" soll.

Dann , der Browser wird es immer noch nicht sofort benutzen! Wenn Sie die Seite das nächste Mal laden, funktioniert der App-Cache wie folgt: genau wie beim letzten Mal und starten Sie die Suche nach einem Update im Hintergrund. Also möchten Sie wahrscheinlich die Konsole hochfahren, warten Sie auf etwas wie "Aktualisieren ...", dann "Fertig stellen", dann drücken Sie auf "Aktualisieren" und der Browser verwendet endlich die neue Version. Zu guter Letzt!

Alles in allem kann es ein richtiger Schmerz sein, sich an die Arbeit zu machen. Sobald es funktioniert, ist es jedoch nahezu kugelsicher: Sie können sicher sein, dass alles, was im Cache-Manifest aufgeführt ist, nur für jede heruntergeladene einmal , je für alle Zeiten pro Benutzer bis zu Ihnen gilt Ändern Sie den Textinhalt der Datei.

Die Einhaltung der Browserstandards ist heutzutage ziemlich gut. Ich schätze, Sie haben es tatsächlich funktioniert, aber Sie haben Chrome zuletzt überprüft und es ist der einzige Browser, der die Manifest-Datei korrekt zwischengespeichert hat. Während der Entwicklung ist es vielleicht kaputt gegangen, aber Firefox und Opera halten ihre alten Manifestdateien für tot. Ich wette, Sie haben auch versucht, den Browser-Cache in Firefox und Opera zu leeren, was wahrscheinlich nichts bewirkt hat. Sie müssen den Textinhalt der Datei ändern und eine doppelte Aktualisierung durchführen, bevor Firefox und Opera ihre beschädigten Versionen der Manifest-Datei und endgültig aufgeben Starten Sie die Funktion, die Sie wahrscheinlich schon vor langer Zeit hochgeladen haben.

15
AshleysBrain

Von: http://appcache.offline.technology

In Firefox werden alle Ressourcen, die mit Cache-Control: no-store bereitgestellt werden, nicht zwischengespeichert, auch wenn sie explizit im Manifest enthalten sind.

Mein PHP sendet standardmäßig:

Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0

Es ist genug hinzuzufügen:

header("Cache-Control: no-cache, must-revalidate");

Um die PHP-Datei dazu zu bringen, das Caching zu starten.

(Dies ähnelt der Antwort von Mychal Hackman, ist jedoch etwas spezifischer).

9
Karen Zilles

Für mich sieht Ihr Cache-Manifest ein bisschen "ungewöhnlich" aus ... es könnte hilfreich sein, einen Abschnitt FALLBACK hinzuzufügen ... ein weiterer Punkt ist, dass der App-Cache möglicherweise den "normalen Browser-Cache" beeinträchtigt, dh wenn das Cache-Manifest geändert wird, muss er geändert werden Vergewissern Sie sich, dass der Browser ihn neu lädt. Im Idealfall wird dies durch Ändern des Namens erreicht (z. B. durch Angabe von Versionsnummer, Zeitstempel ... als Teil des Namens).

Sie können auf Ihrer Seite über JS mit dem Appcache interagieren, um das Problem zu lokalisieren.

Ausführliche Informationen, einschließlich JS-Code und einer ausführlichen Anleitung, finden Sie unter

Gegebenenfalls kommen Sie mit konkreten Fragen zurück.

AKTUALISIEREN

Gemäß den von OP bereitgestellten Kommentaren zeigt this eine nette Implementierung der JS-API zum Überprüfen/Debuggen von Appcache, wie in den obigen Links beschrieben.

3
Yahia

Überprüfen Sie Ihren Cache in about:cache. Ich wette, Sie sehen "Datengröße 0 Bytes" für Ihre PHP Datei (en).

Überprüfen Sie Ihre Caching-Header, ich fand in Firefox die Standardeinstellung "no-cache" für meine PHP-Dateien. Ich habe gerade hinzugefügt:

header("Pragma: public");
header("Cache-Control: public, max-age=6000");

in meine PHP Datei und lade den Offline-Cache neu und es funktioniert endlich.

HTH

3
Mychal Hackman

Sie können den aktuellen Status des Anwendungscaches mit window.applicationCache.status überprüfen. Dabei wird ein numerischer Wert zurückgegeben, der den folgenden Zuständen zugeordnet ist: 0 - uncached, 1 - idle, 2 - checking, 3 - downloading, 4 - updateready, 5 - obsolete.

Die API für den Anwendungscache weist einige bemerkenswerte Punkte auf: window.applicationCache.update(): Dies löst den Download-Vorgang für den Anwendungscache aus, der fast dem erneuten Laden der Seite entspricht. Es wird lediglich geprüft, ob sich das Manifest geändert hat, und in diesem Fall wird eine neue Version des gesamten Inhalts im Cache heruntergeladen (wobei Cache-Header berücksichtigt werden). Beachten Sie, dass selbst wenn ein neuer Cache mit dieser erstellt wird, wird die Seite weiterhin die alte Cache verwenden. Damit die Seite den gerade heruntergeladenen neuen Cache verwendet, müssen Sie die Funktion swapCache() verwenden.

window.applicationCache.swapCache(): Diese Funktion weist den Browser an, die neuen Cache-Daten zu verwenden, sofern diese verfügbar sind. Es ist wichtig zu beachten, dass die Anwendung auch dann den alten Cache (wie in der alten Manifestdatei angegeben) verwendet, wenn eine neue Manifestdatei vorhanden ist, bis swapCache() aufgerufen wird. Sobald swapCache() aufgerufen wird, wird der Cache wie in der neuen Manifestdatei angegeben verwendet.

from: http://dev.opera.com/articles/view/offline-applications-html5-appcache/

3
c69

Versuchen Sie, Folgendes zu entfernen:

header("Cache-Control: max-age=0, no-cache, no-store, must-revalidate");
header("Pragma: no-cache");
header("Expires: Wed, 11 Jan 1984 05:00:00 GMT");

so dass Sie nur den Content-Type-Header senden:

<?php header('Content-type: text/cache-manifest'); ?>

ApplicationCache erzwingt das Zwischenspeichern (zu stark vereinfacht, aber nicht zu stark). Diese ersten drei Überschriften verhindern das Zwischenspeichern.

Opera scheint das Cachen zu verhindern, wenn diese Header vorhanden sind. Die Debugging-Tools von Firefox sind beim Debuggen von AppCache ein wenig umständlich, aber es ist wahrscheinlich sicher, anzunehmen, dass dies auch dort behoben werden kann.

2
webinista

Versuchen Sie für Firefox diesen kleinen Trick:

<html manifest="/app/mobile/cache.manifest.php?1"> 

Es ist die "? 1", mit der Firefox endlich nach der neuesten Datei sucht. Das hat mir sowieso geholfen. Hoffe das hilft.

2
infinityShawn

Aus meiner Erfahrung mit dem Offline-Betrieb einer Website auf dem iPad:

  • Der Name der Datei muss mit .manifest enden
  • Der MIME-Typ muss text/cache-manifest sein
  • Haben Sie eine Version in den Kommentaren Ihres Manifests
  • Erstellen Sie mit window.applicationCache... einige Javascript-Funktionen, um zu überprüfen, ob der Browser eine Änderung im Manifest feststellt, und um den Inhalt neu zu laden. Erfassen Sie auch die Statusereignisse und zeigen Sie sie an

Siehe auch: http://developer.Apple.com/library/safari/#documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html#//Apple_ref/doc/uid/TP40007256-CH7-SW1

1
ZippyV

Ich hatte ein ähnliches Problem. Ich antworte sehr spät, aber das könnte für andere hilfreich sein. Stellen Sie sicher, dass Sie nicht auf Probleme stoßen, die AshleysBrian in seiner Antwort beschrieben hat. Hinzu kommt

  1. Stellen Sie sicher, dass die Manifestdatei als Typ "text/cache-manifest" bereitgestellt wird.
  2. Probieren Sie es nicht im privaten Browsermodus in Firefox/IE aus. Es funktioniert nur im normalen Browsermodus. Aber es funktioniert in beiden Modi in Chrome
  3. Im Offlinemodus kann eine einfache Änderung der URL ein Problem darstellen

    Eg: http://localhost:8080/app doesn't work on Firefox/IE
    but http://localhost:8080/app/ works in Firefox/IE 
    

    Beide funktionieren in Chrome

  4. Verwenden Sie diese praktischen Ressourcen-Viewer, um eine detailliertere Perspektive zu erhalten

    about:cache - Firefox
    chrome://appcache-internals/ - Chrome
    Pls fill in if someone knows what is it for IE
    
1
user1429007

Meine einzige Möglichkeit, das Manifest überall zum Funktionieren zu bringen, besteht darin, Folgendes zu tun:

CACHE MANIFEST
# version x.x
# 2015-03-27

# list everything

Wenn ich NETWORK und/oder FALLBACK verwende, funktioniert das nicht (in Chrome).

0
Jordan

Ich habe etwas Ähnliches gefunden und es bis zur Überschrift Cache-Control: no-store im Manifest verfolgt. Chrome akzeptiert dies, aber Firefox schlägt damit unbemerkt fehl.

Meine Tests haben gezeigt, dass Sie Header ohne Cache und abgelaufene Header beibehalten können, um häufige Aktualisierungen sicherzustellen.

0
Adam T

Soweit ich weiß, ist der Abschnitt über Offline-Webanwendungen im W3C-HTML5-Entwurf nicht normativ. Das heißt, es ist noch nicht Teil des formalen HTML5-Standards.

Da die Funktion immer noch nicht Teil des HTML5-Standards ist, können verschiedene Browser unterschiedliche und unterschiedliche/nicht standardmäßige Implementierungen aufweisen, wenn sie sich überhaupt dafür entscheiden, sie zu implementieren. Möglicherweise unterstützen nicht alle Browser diese Funktion. Verlassen Sie sich erst dann auf nicht normative Funktionen, wenn diese Teil des Standards sind.

0
Drona