(1) Background
Through offline storage, we list the files that need to be stored offline in the configuration file of the manifest, so that users can see the webpage normally even when offline
(2) Arrangement
(1) Add manifest="cache configuration file name" to the page that needs to be cached. It is best to put the file in the root directory
<html lang="en" manifest="cache.manifest">(2) Create a new cache.manifest in the root directory of the current folder,
The manifest file has three basic formats: cache, network and fallback, among which network and fallback are optional.
The first line of cache manifest is a fixed format and must be written in front.
Those beginning with # are comments, which can be version numbers, timestamps, etc. Generally, you will write a version number here to change the manifest when the cached file is updated. The role of the version number: the browser has cached the cache, and the local cache will only be updated when the manifest file changes, even if your code The local browser does not know about the update, so every time you publish the code, you can change the information following #, such as the version number or time, to tell the browser to update the local cache accordingly.
1. Cache (required) Identify which files need to be cached, which can be a relative path or an absolute path. The files listed here will be cached locally by the browser when they are loaded for the first time.
2. network: It means that the resources listed below can only be accessed when online, and these resources will not be stored offline. These resources cannot be used offline and can only be accessed when the network is connected to the Internet
4. Fallback (optional) When the resource cannot be accessed, the browser uses a backup resource to replace it. The second represents the backup page. Both uris must use relative paths and be the same as the manifest file. You can use wildcards.
CACHE MANIFEST
#v0.1
CACHE:
js/index.js
css/index.css
NETWORK:
images/logo.png
FALLBACK:
*.html /404.html(Three) view
Can be seen in Application ---- Application cache
(1) The server needs to be started to cache successfully
(2) Application cache can be seen in the URL beginning with https