興味深いオフラインストレージ
2193 ワード
興味深いオフラインストレージ
一.簡単に話す
最近ずっと実習の準備をしているので、概念を復習している間に、私は偶然面白い技術点を見つけて、わざわざみんなと分かち合いに来ました.Web Appの発展に伴い、現在多くのモバイル端末AppがHTML 5方式で開発されているが、問題はそれに伴い、一部のHybridApp以外のWeb Appはブラウザを通じてアクセスされている.ブラウザを通じてアクセスすると、インターネットを通じて要求を送信しなければならない.これにより、ユーザーがオフラインでアプリを使用できなくなる.同時にAppではすべてのデータが常に変更されるわけではなく、毎回サーバにリクエストを送信する必要もないので、このオフラインキャッシュという新しい属性が誕生しました.オフラインストレージにより、ローカルにオフラインで保存する必要があるファイルをmanifestプロファイルにリストすることで、上記の問題を解決できます.これにより、オフラインの場合でも、ユーザーはAppを正常に使用することができます.
二.オフライン保存の食べ方
次にmanifest(オフラインキャッシュ)をプロパティとオフラインキャッシュファイルの内容に分けて、簡単にお話しします.
2.1 mainfestプロパティ
2.2 chache.manifestのファイル内容
三.ブラウザがmainfestを解析する方法
「こんなにたくさん言っているのに、ブラウザはどのようにオフラインのリソースを管理してロードしているのか」という疑問があるかもしれません.焦らないでください.このことは具体的に2つの状況に分けて議論しています.今からゆっくり話してあげます.
3.1オンラインの場合
ブラウザはhtmlヘッダにmanifestプロパティがあることを発見し、manifestファイルを要求します.appに初めてアクセスすると、ブラウザはmanifestファイルの内容に基づいて対応するリソースをダウンロードし、オフラインで保存します. appにアクセスし、リソースがオフラインで格納されている場合、ブラウザはオフラインのリソースを使用してページをロードし、ブラウザは新しいmanifestファイルと古いmanifestファイルを比較し、ファイルが変更されていない場合は何もせず、ファイルが変更された場合は、ファイル内のリソースを再ダウンロードしてオフラインで格納します.
3.2オフラインの場合
ブラウザでは、オフラインで保存されたリソースが直接使用されます.
注意事項:
サイトオフラインストレージの容量制限は5 M
サーバがオフラインのリソースを更新した場合、ブラウザに再ダウンロードされるにはmanifestファイルを更新する必要があります.リソースを更新しただけでmanifestファイルを更新していない場合、ブラウザはリソースを再ダウンロードしません.つまり、元のオフラインストレージのリソースも使用します.
manifestファイルをキャッシュするときは注意が必要です.manifestファイルを更新した場合があるかもしれませんが、httpのキャッシュルールはブラウザにローカルキャッシュのmanifestファイルが期限切れではないことを示しています.この場合、ブラウザは元のmanifestファイルを使用しますので、manifestファイルにはキャッシュを設定しないほうがいいです.
manifestファイル、または内部に列挙されたファイルが正常にダウンロードできない場合、更新プロセス全体が失敗したとみなされ、ブラウザは古いキャッシュをすべて使用し続けます.
一.簡単に話す
最近ずっと実習の準備をしているので、概念を復習している間に、私は偶然面白い技術点を見つけて、わざわざみんなと分かち合いに来ました.Web Appの発展に伴い、現在多くのモバイル端末AppがHTML 5方式で開発されているが、問題はそれに伴い、一部のHybridApp以外のWeb Appはブラウザを通じてアクセスされている.ブラウザを通じてアクセスすると、インターネットを通じて要求を送信しなければならない.これにより、ユーザーがオフラインでアプリを使用できなくなる.同時にAppではすべてのデータが常に変更されるわけではなく、毎回サーバにリクエストを送信する必要もないので、このオフラインキャッシュという新しい属性が誕生しました.オフラインストレージにより、ローカルにオフラインで保存する必要があるファイルをmanifestプロファイルにリストすることで、上記の問題を解決できます.これにより、オフラインの場合でも、ユーザーはAppを正常に使用することができます.
二.オフライン保存の食べ方
次にmanifest(オフラインキャッシュ)をプロパティとオフラインキャッシュファイルの内容に分けて、簡単にお話しします.
2.1 mainfestプロパティ
...
html>
2.2 chache.manifestのファイル内容
CACHE MANIFEST
#v0.11
CACHE:// ， manifest ， 。
js/app.js
css/style.css
NETWORK://
resourse/logo.png
FALLBACK:
/ /offline.html// ， ， ， offline.html。
三.ブラウザがmainfestを解析する方法
「こんなにたくさん言っているのに、ブラウザはどのようにオフラインのリソースを管理してロードしているのか」という疑問があるかもしれません.焦らないでください.このことは具体的に2つの状況に分けて議論しています.今からゆっくり話してあげます.
3.1オンラインの場合
ブラウザはhtmlヘッダにmanifestプロパティがあることを発見し、manifestファイルを要求します.appに初めてアクセスすると、ブラウザはmanifestファイルの内容に基づいて対応するリソースをダウンロードし、オフラインで保存します. appにアクセスし、リソースがオフラインで格納されている場合、ブラウザはオフラインのリソースを使用してページをロードし、ブラウザは新しいmanifestファイルと古いmanifestファイルを比較し、ファイルが変更されていない場合は何もせず、ファイルが変更された場合は、ファイル内のリソースを再ダウンロードしてオフラインで格納します.
3.2オフラインの場合
ブラウザでは、オフラインで保存されたリソースが直接使用されます.
注意事項:
サイトオフラインストレージの容量制限は5 M
サーバがオフラインのリソースを更新した場合、ブラウザに再ダウンロードされるにはmanifestファイルを更新する必要があります.リソースを更新しただけでmanifestファイルを更新していない場合、ブラウザはリソースを再ダウンロードしません.つまり、元のオフラインストレージのリソースも使用します.
manifestファイルをキャッシュするときは注意が必要です.manifestファイルを更新した場合があるかもしれませんが、httpのキャッシュルールはブラウザにローカルキャッシュのmanifestファイルが期限切れではないことを示しています.この場合、ブラウザは元のmanifestファイルを使用しますので、manifestファイルにはキャッシュを設定しないほうがいいです.
manifestファイル、または内部に列挙されたファイルが正常にダウンロードできない場合、更新プロセス全体が失敗したとみなされ、ブラウザは古いキャッシュをすべて使用し続けます.