問題タブ [html5-appcache]

オフラインで利用できるようにしたい動的ページがあります。これを行うには、HTML5 のアプリケーション キャッシュを使用したいと思います。問題は、ページのすべてのリソース (JavaScript および CSS) が動的であるため、事前に把握していないことです。

次のような manifest.appcache ファイルがあります。

しかし、これはページの HTML のみをキャッシュし、ページの残りのリソースはキャッシュしないようです。このようなことをする方法はありますか？

そうでない場合、JavaScript を使用してプログラムでキャッシュを設定することは可能でしょうか (link タグと script タグをループできると思います)。

ブラウザーは Application Cache マニフェスト ファイルの要求をどのように実装していますか? また、他のファイルの要求方法とは異なりますか?

IIS 7 で Windows/NTLM 認証を使用すると、予期しない動作が発生するので質問します。状況は、マニフェスト ファイルが定義されたサイトを持っていることです。匿名認証を使用すると、すべてが期待どおりに機能します。サイトが読み込まれ、オフラインで利用できます。

匿名を無効にして Windows 認証を有効にすると、サイトは認証後に正常に読み込まれますが、マニフェスト ファイルをフェッチできなかったというエラーがコンソール (Chrome または iPad 2) に表示されます。

iPad では、アプリケーション キャッシュ ファイルを取得できなかったというエラーが表示されます。Chrome では、特定のエラーは「Application Cache Error event: Manifest fetch failed (401)」です。両方のインスタンスの Web サーバー ログに 401 応答コードが表示されます。

この動作が予期しないように見える理由は、他のすべてのリソース (CSS、JavaScript、画像) に対する要求がすべて期待どおりに機能するためです。また、.appcache ファイルを参照して読み込むこともできます。

誰が何が起こっているのか説明できますか?

他の誰かがこれに遭遇し、解決策を見つけましたか?

HTML5 アプリケーション キャッシュを使用しようとしている Web アプリを開発しています。

ファイルを正常にキャッシュし、オンライン中に AppCache からファイルをロードできます。しかし、オフラインにすると、すべての css および js ファイルが application/x-javascript または text/css ではなく、text/html という MIME タイプで転送されるため、オフラインで正しく動作しません。

これは、オフライン中にページをリクエストしたときに得られるものです。

したがって、ページはスタイル設定されておらず、あらゆる種類の JS エラーが発生しています。

css および js ファイルがオフライン中に appcache から適切な MIME タイプで転送されるように適切に設定するにはどうすればよいですか? あなたの提案に感謝します

更新：これは、サーバーでマニフェストファイルを提供する方法です

この検証テストに合格しました: http://manifest-validator.com/

ここに私のマニフェストファイルがあります:

これは、chrome://appcache-internals/ の MIME タイプとその他の詳細を示すキャッシュ ファイルの 1 つです。

別の更新: これは、MIME タイプのエラーが発生することなく、Firefox で正常に動作します。なおや

jquery モバイルを実行している webapp に appcache を追加すると、サーバーから json ファイルを要求するすべての ajax 呼び出しが機能しなくなりました。私のマニフェストファイルは次のようになります。

initJson は機能しない呼び出しの 1 つです。完全なアドレス (aaa:bbb:ccc:ddd:6565/initJson) を入力しようとしましたが、成功しませんでした。

私の .htaccess ファイルには、次の 1 行しかありません。

私は、パフォーマンスが非常に重要な問題である Web プロジェクトに取り組んでいます。

編集：

状況：

ユーザーのワークフローに関する詳細を追加したいと思います。

1. ユーザーが私のウェブサイトのウェルカム ページにアクセスしhttp://example.org/ます。
2. 彼はページにアクセスするためにリンクをクリックしますhttp://example.org/mypage
3. onclick-リンクのハンドラが実行されました。
4. ハンドラーは、XHR を使用してデータをロードします。
5. ハンドラーはhttp://example.org/mypage動的に作成します。
6. FileSystem APIハンドラーは、 at を使用してローカルに mypage を保存しfilesystem:http://example.org/mypageます。EDIT：（クライアント側にfilesystem:http://example.org/mypage保存されているローカルリソースです）FileSystem
7. ハンドラーは履歴を拡張し、ロケーション バーのURL を (ウェルカム ページの URL) からHistory API(ユーザーが見たいページ) に変更します。http://example.org/http://example.org/mypage
8. その間、ユーザーは別のページにアクセスします。
9. その後、ユーザーhttp://example.org/mypageはロケーション バーに直接入力します。
10. ブラウザは、 の代わりにfilesystem:http://example.org/mypage(のローカルに保存されたバージョン) を表示/ロードします。つまり、ブラウザは新しいリクエストを作成せず、ローカルに保存された のコピーを使用します。http://example.org/mypagehttp://example.org/mypagehttp://example.org/mypage

新しいリクエストを作成する代わりに、ブラウザがページのローカルに保存されたバージョンを使用するようにするにはどうすればよいですか? 編集: - 上記のリストの #10 でやりたいことです。

編集：

私の質問：

http://example.org/mypageクライアント側は、上記のリストの #2 から #7 で既に作成/生成されています。そのページをもう一度作成する必要はありません。そのため、ブラウザに のリクエストを作成させたくないのですhttp://example.org/mypage。

それが私がやりたいことです：

filesystem:http://example.org/mypageがすでに作成されている場合 (ユーザーが既に にアクセスしたことがある場合) http://example.org/mypage:

filesystem:http://example.org/mypageの代わりに使用しhttp://example.org/mypageます。

さもないと：

のリクエストを送信http://example.org/mypage

解決しようとします:

1. マニフェスト ファイルのフォールバック セクションを使用して次のようなことを行うことはできません: EDIT: (orgin は別として)

   フォールバック: http://example.org/mypageファイルシステム:http://example.org/mypage

フォールバック ディレクティブは、ユーザーがオフラインの場合にのみ使用され、それ以外の場合は無視されるため、FileSystem に保存されているローカル バージョンをブラウザーに使用させるためです。編集:しかし、ユーザーがオンラインであっても、のfilesystem:http://example.org/mypage代わりに使用したい。http://example.org/mypage

1. 新しいリクエストを作成せず、キャッシュされたバージョンを使用するために、サーバー生成ページのレスポンス ヘッダーで Expire フィールドを使用できることを知っています。

しかし、JS と XHR を使用してクライアント側で動的にページを作成するとどうなるでしょうか。編集: (そのケースについては で説明しましたThe situation) クライアント側でページを作成する場合、クライアントにそのページをキャッシュさせる方法はありません。FileSystem APIそのため、クライアント側に保存するためにページを手動で「キャッシュ」します。

パフォーマンスを向上させるために、ユーザーが既にローカルにアクセスしたページを保存しようとしています。ユーザーがページに再度アクセスすると、ローカルに保存された古いバージョンのページが表示され、スクリプトは XHR を作成して、その間にページが変更されたかどうかを確認します。

しかし、ブラウザでページのローカル バージョンを使用するにはどうすればよいでしょうか。生成されたページは、FileSystem API を使用してクライアント側にローカルに保存できます。生成されたページの URL を選択して、History API を使用してブラウザーのロケーション バーに表示できます。
ユーザーが別のサイトにアクセスして戻るボタンを押すと、イベント ハンドラーによって onPopState イベントをキャッチできます。
そして、そのイベント ハンドラーは、FileSystem API を使用して、動的に作成されたファイルを読み込むことができます。
しかし、ユーザーが [戻る] ボタンを使用せず、History API を使用して登録した URL をロケーション バーに直接入力した場合はどうすればよいでしょうか?
その場合、ブラウザはローカルに保存されたバージョンのページを使用せず、ブラウザはサーバーからページをロードするリクエストを作成します。

HTML5 appcache 機能を使用するように変更された Web ページの 1 つで問題が発生しました。ページで appcache が有効になっていると、Chrome 19 (以前のバージョンだと思われます) がクロスサイト CSS ファイルをブロックしています。このページhttp://www.ericperrets.info/index.htmlは、サーバーから多数の画像/css ファイルをロードし、Google url/servers から多数の css ファイルをロードします。以下は epi.appcache ファイルの内容です

これは、最新の safari または firefox でページが読み込まれたときに検出されますが、Chrome で読み込もうとすると、http://fonts.googleapis.com/css?family=Reenie+Beanie|Candal&v1&text= への呼び出しがブロックされます。 ERIC%20PT%E2%80%99SINFOAesumWorkaplntcfLidh%2C

更新: Chrome 用に持っていたプラグインの 1 つを無効にすることで問題を修正しました: HTTPS Everywhere。これは本当に便利なプラグインです。URL を https に変更する以外に、この問題を回避する方法はありますか?

重複の可能性:
私の HTML5 アプリケーション キャッシュ マニフェストはすべてをキャッシュしています

キャッシュできる webapp を作成しましたが、キャッシュによって多くの問題が発生したため、キャッシュをすべてクリアする必要があります。

これは私のサーバーで自動的に行うことができますか?

これらのオプションは機能しますか?

• <html manifest="cache.appcache">に変更<html>
• cache.appcacheサーバーからファイルを削除する
• NETWORK:すべてのリソースの上にタイトルを追加する

私は、WebViews、外部でホストされている js ファイル、および appcache を制御するためのマニフェスト ファイルを利用する Android アプリを作成しています。Android 4 ではすべて正常に動作しているように見えますが、2.2 ではキャッシュが機能していないようです。

フローは次のとおりです。

1. Android アプリは、ローカルの html ファイルを読み込み、webview に読み込みます。

2. ローカルの html ファイルには、ウィンドウの場所をリモートの「ブートストラップ」ファイルの場所に切り替える JavaScript が含まれています。

3. ブートストラップ ファイルには、JavaScript アプリケーションとサポートする CSS をダウンロードするための JavaScript と、スクリプト/リンク タグを dom に書き込むための JavaScript と、リモート マニフェスト ファイルへのリンク (ブートストラップ ファイルおよびアプリケーション ファイルと同じ場所から提供される絶対 URL) が含まれています。 ）。

4. アプリケーションがダウンロードされ、画面にレンダリングされます。

マニフェスト ファイルは次のようになります。

私が抱えている問題は、アンドロイド 2.2 (HTC 欲望 HD) では、マニフェスト ファイルを変更すると、アプリはブートストラップ html ファイルのみを再ダウンロードし、app-mobile.js および css ファイルを無視し、常にキャッシュ内のもの。これは、Android 4 での期待どおりに機能します (マニフェスト ファイルを変更すると、指定されたすべてのリソースが再ダウンロードされます)。

これをエミュレータとデバイスで実行しましたが、結果は同じです。

誰かが私が間違っていることを見ることができますか?

前もって感謝します。

私は最新の Firefox (11) を使用しており、*.appcache を text/cache-manifest として提供するように IIS を設定し、「about:cache」「C: \Users\\AppData\Local\Mozilla\Firefox\Profiles\.\OfflineCache" ( MDNによると)、以下は私の demo.appcache ファイルです。

私の手順は次のとおりです。

1. [オプション] -> [詳細設定] -> [オフライン Web コンテンツとユーザー データ] -> [今すぐ消去] ですべてのキャッシュを消去します。
2. で私のhtmlページにアクセスします<html manifest="demo.appcache">
3. 上記の demo.appcache で指定されたアイテムを Firefox が二重にキャッシュしました。
4. Menu -> Web Developer -> Work Offline で Firefox を "Work Offline" に切り替えます。
5. 「Online.html」にアクセスし、 Firefox が offline.html を表示することを期待していますが、「オフラインのため、ページにアクセスできません」と表示されます。

Chrome はすべてを正しく実行しますが、「オフライン モード」に切り替えることはできません。参照:壊れたオフライン サポート Opera はオフラインで動作できますが、キャッシュは正しく行われますが、offline.html をキャッシュしませんでした。標準。

この問題 (手順 5) に 3 日以上悩まされています。

マニフェストに次の FALLBACK セクションがあります

Firefox とそのオフライン作業機能で試しています。これは、pageA.php、pageB.php などの任意の URL で機能します。しかし、このように URL を入力すると

その後、オフライン ページは表示されず、警告メッセージのみが表示されます。

Firefox は現在オフライン モードであり、Web を閲覧できません

パラメータを含む URL が offline.html にもフォールバックされるようにマニフェストを変更する方法はありますか?