[Html5]app offline cache (application cache)

Therefore, this interface is to let Web pages or files in the local cache, the advantage is that it can improve the loading speed of the site, in the same way, if you cache all files locally, you can browse the Web page offline.

We can cache those frame files and the old image files locally, increasing the load speed of the site two views.

1. First create a file named Index.appcache (the file name can be defined by itself), Index.appcache file contents:

CACHE manifest#version 0.1.0cache:lib/framework7/css/framework7.ios.min.css lib/framework7/css/ FRAMEWORK7.IOS.COLORS.MIN.CSS lib/framework7/js/framework7.min.jsnetwork: *

Description: The cache represents the file to be cached, and the blogger has chosen the FRAMEWORK7 framework's three files to be cached locally, since it does not require a secondary load. The network represents a file that does not need to be cached (the meaning of the * should not be explained), and bloggers use version to pretend that the app revision number controls the file changes.

2. Then in

3. Add Event listener on page page

function (e) {  window.applicationCache.addEventListener (function(e) {
if (window.applicationcache.status==Window.applicationCache.UPDATEREADY) {      Window.applicationCache.swapCache ();       if (Confirm (' WebApp has new version updated, is it updated?) ') {        window.location.reload ();      }    } Else {      console.log (' WebApp is the latest version! ');    }   false  false)

There's nothing in the code that's worth saying, it's short and there's no special meaning, and it's worth noting that:

1). There are two ways to cache files, specifying and adding manifest properties, as long as the page has manifest properties.

2). Cached pages If you have parameters to each cache with parameters, such as index.html is to be cached, then index.html?id=1 will also be added as a different cache, so the multi-parameter page is not recommended to use the AppCache method cache!

[Html5]app offline cache (application cache)