web-dev-qa-db-ja.com

HTML5-キャッシュマニフェストはChromeでうまく機能しますが、FirefoxとOpera

オフラインで使用するWebアプリを開発しているため、アプリケーションキャッシュ機能を使用する必要があります。

Chrome(15.0.874.106)ではすべてうまく機能しますが、Firefox(7.0.1)およびOpera(11.52)では機能しません。

これは私のキャッシュマニフェストファイルですcache.manifest.php(私はそれを最小限に減らしました):

<?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

そして、これは「メイン」HTMLドキュメントの最初の4行です。

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

キャッシュマニフェスト(http://www.myapp.com/app/mobile/cache.manifest.php)をブラウザーにロードしようとすると、ファイルは正しく表示されますが、オフラインでページをロードしようとすると、 「接続できません」エラーページ。繰り返しますが、これはFirefoxとOperaでのみ発生します。

Firebugは「0 items in offline cache "そしてDragonFlyのアプリケーションキャッシュをチェックする方法が見つかりませんでした。

私は怒っており、FirefoxとOperaで問題を効果的にデバッグする方法がわかりません。助けてください。

ありがとう、ダン

22
dan

HTML5 AppCacheを使用した私の経験では、一度機能させると素晴らしいですが、非常に脆弱です。それで最も小さな問題がある場合、ブラウザはファイル全体を無視し、迷惑なことに、ブラウザの通常のキャッシュを使用するのではなく、サーバーからすべてを最初から再ロードします。

さらに悪いことに、ブラウザはマニフェストファイルを再ロードしませんそのテキストコンテンツが変更されない限り。したがって、サーバーヘッダーなどを微調整して修正することもできますが、cache.manifest.phpchangesのコンテンツがない限り、ブラウザはやみくもにそれを無視して実行します前回とまったく同じ。そのため、壊れている可能性があり、修正しましたが、cache.manifest.phpのテキストコンテンツが変更されていないため、ブラウザは変更を無視しています。これは、ブラウザのキャッシュをクリアすることにも影響されないようです。これは、ブラウザのキャッシュを非常に混乱させる原因の1つです。アプリのキャッシュは、キャッシュについて非常に深刻です。

これを回避するには、コメントのテキストの変更が重要であるため、バージョン、タイムスタンプ、または日付(# Version 1.2など)を含むコメントを上部に配置し、ブラウザに「通知」させたいときに変更します。

Then、ブラウザはまだすぐには使用しません!アプリのキャッシュが機能する方法は、次にページを読み込んだときに実行されます前回とまったく同じもう一度、バックグラウンドで更新の確認を開始します。したがって、おそらくコンソールを起動し、「更新中...」、「完了」のようなものを待ちます。その後 [更新]をクリックすると、ブラウザは最終的に新しいバージョンの使用を開始します。やっと!

全体として、仕事を始めるのは正しい苦痛かもしれません。ただし、動作すると、ほぼ防弾になります。キャッシュマニフェストにリストされているものは、ダウンロードされるたびにのみ発生するので、ほぼ安心できますonceever、常に、ユーザーごとに、ファイルのテキストコンテンツを変更するまで。

最近のブラウザ標準への準拠はかなり良いので、実際に動作していると思いますが、最後にChromeをチェックし、マニフェストファイルを正しくキャッシュした唯一のブラウザです。開発中に壊れていたかもしれませんが、FirefoxとOperaは古いマニフェストファイルを死に至らしめています。FirefoxとOperaのブラウザキャッシュもクリアしようとしましたが、おそらく何もしませんでした。必要です。ファイルのテキストコンテンツを変更し、FirefoxとOperaのいずれかが最終的にマニフェストファイルの壊れたバージョンを放棄し、おそらく何年も前にアップロードしたものを使用し始める前に、ダブルリフレッシュする。

15
AshleysBrain

差出人: http://appcache.offline.technology

Firefoxでは、Cache-control:no-storeで提供されるリソースは、マニフェストに明示的に含まれていてもキャッシュされません。

私のphpはデフォルトで送信しています:

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

追加するだけで十分です:

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

Phpファイルにキャッシュを開始するように取得します。

(これはMychal Hackmanの回答に似ていますが、もう少し具体的です)。

9
Karen Zilles

私にはあなたのキャッシュマニフェストは少し「珍しい」ように見えます...FALLBACKセクションを追加すると役立つかもしれません...別のポイントは、appcacheが「通常のブラウザキャッシュ」に干渉する可能性があることです。変更された場合は、ブラウザがそれをリロードすることを確認する必要があります。理想的には、名前を変更することでこれを実現します(たとえば、名前の一部としてバージョン番号、タイムスタンプなどを使用します)。

JSを介してページ内でappcacheを操作できます。これは、発生した問題を特定するのに役立ちます。

JSコードや詳細なウォークスルーなどの詳細情報については、を参照してください。

必要に応じて、具体的な質問をして戻ってきてください。

更新

OPによって提供されたコメントによると this は、上記のリンクで説明されているように、appcacheをチェック/デバッグするためのJSAPIの優れた実装を示しています。

3
Yahia

about:cacheのキャッシュを確認してください。 PHPファイル)に「データサイズ0バイト」が表示されることは間違いありません。

キャッシュヘッダーを確認してください。Firefoxでは、phpファイルのデフォルトは「キャッシュなし」でした。追加しました:

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

私のPHPファイルに、オフラインキャッシュをリロードすると、ようやく機能します。

HTH

3
Mychal Hackman

_window.applicationCache.status_を使用して、アプリケーションキャッシュの現在のステータスを確認できます。これにより、次の状態にマップされた数値が返されます:_0 - uncached_、_1 - idle_、_2 - checking_、_3 - downloading_、_4 - updateready_、_5 - obsolete._

アプリケーションキャッシュAPIには、注目に値するいくつかの点があります。window.applicationCache.update():これにより、アプリケーションキャッシュのダウンロードプロセスがトリガーされます。これは、ページのリロードとほぼ同じです。マニフェストが変更されたかどうかを確認し、変更された場合は、キャッシュ内のすべてのコンテンツの新しいバージョンをダウンロードします(キャッシュヘッダーを尊重します)。これで新しいキャッシュが作成されても、ページは引き続き古いキャッシュを使用することに注意してください。ダウンロードしたばかりの新しいキャッシュをページで使用するには、swapCache()関数を使用する必要があります。

window.applicationCache.swapCache():この関数は、新しいキャッシュデータが利用可能な場合に使用を開始するようにブラウザに指示します。新しいマニフェストファイルがある場合でも、アプリケーションはswapCache()が呼び出されるまで、(古いマニフェストファイルで指定されている)古いキャッシュを使用し続けることに注意することが重要です。 swapCache()が呼び出されると、キャッシュは新しいマニフェストファイルから指定されたとおりに使用されます。

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

3
c69

削除してみてください:

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");

content-typeヘッダーのみを送信するように:

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

ApplicationCacheはキャッシュを強制します(単純化しすぎますが、それほどではありません)。これらの最初の3つのヘッダーは、キャッシュを防ぐ方法です。

これらのヘッダーが存在する場合、Operaはキャッシュを防止しているようです。 Firefoxのデバッグツールは、AppCacheのデバッグに関しては少し不安定ですが、これで修正されると想定するのはおそらく節約になります。

2
webinista

Firefoxの場合は、次の小さなトリックを試してください。

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

最終的にFirefoxに最新のファイルをチェックさせるのは「?1」です。それはとにかく私のためにトリックをしたものです。お役に立てれば。

2
infinityShawn

IPadでサイトをオフラインで動作させた私の経験から:

  • ファイルの名前は.manifestで終わる必要があります
  • Mimeタイプはtext/cache-manifestである必要があります
  • マニフェストのコメントにバージョンがあります
  • window.applicationCache...を使用していくつかのJavaScript関数を作成し、ブラウザーがマニフェストに変更を認識しているかどうかを確認し、コンテンツを再読み込みします。また、ステータスイベントをキャプチャして、どこかに表示します。

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

1
ZippyV

私も同様の問題を抱えていました。私は答えるのがとても遅いですが、これは他の人にとって役立つかもしれません。 AshleysBrianが彼の答えで説明した問題に遭遇しないようにしてください。それに加えて

  1. マニフェストファイルがタイプ「text/cache-manifest」として提供されていることを確認してください
  2. Firefox/IEのプライベートブラウジングモードで試してはいけません。通常のブラウジングモードでのみ機能します。ただし、Chromeでは両方のモードで機能します
  3. オフラインでは、URLの単純な変更が問題になる可能性があります

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

    どちらもChromeで動作します

  4. これらの便利なリソースビューアを使用して、より詳細な視点を取得します

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

マニフェストをどこでも機能させる唯一の方法は、これを行うことです。

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

# list everything

NETWORKおよび/またはFALLBACKを使用すると、(Chromeでは)機能しません。

0
Jordan

私は似たようなものを見つけ、それをCache-Control:マニフェストのno-store見出しまで追跡しました。 Chromeはこれを受け入れますが、Firefoxはこれでサイレントに失敗します。

私のテストでは、キャッシュなしのヘッダーと期限切れのヘッダーを保持して、頻繁に更新できることが示されました。

0
Adam T

私が理解しているように、W3CHTML5ドラフトのオフラインWebアプリケーションのセクションは規範的ではありません。つまり、まだ正式なHTML5標準の一部ではありません。

この機能はまだHTML5標準の一部ではないため、ブラウザが異なると、実装を選択したとしても、実装が異なり、さまざまな/非標準になる可能性があります。すべてのブラウザがそれをサポートすることを選択できるわけではありません。それらが標準の一部になるまで、非規範的な機能に依存しないでください。

0
Drona