Online Whitelist and Fallback Options
It is possible to force the browser to always
access certain resources over the network (this process is known as
whitelisting). This means the browser will not cache
them locally and they will not be available when the user is offline. To
specify a resource as online only, use the NETWORK:
keyword
(the trailing :
is essential) in the manifest file like
so:
CACHE MANIFEST index.html scripts/demo.js styles/screen.css NETWORK: logo.jpg
This whitelists logo.jpg by moving it into the
NETWORK
section of the manifest file. When the user is
offline, the image will show up as a broken image link (Figure 6-2). When he is online, it will appear
normally (Figure 6-3).
If you don’t want offline users to see the
broken image, use the FALLBACK
keyword to specify a fallback
resource like so:
CACHE MANIFEST index.html scripts/demo.js styles/screen.css FALLBACK: logo.jpg offline.jpg
Now, when the user is offline, he’ll see offline.jpg (Figure 6-4), and when he’s online, he’ll see logo.jpg (Figure 6-5).
Figure 6-2. Whitelisted images will show up as broken links when the user is offline
Figure 6-3. Whitelisted images will show up normally when the user is online
Figure 6-4. Fallback ...
Get Building Android Apps with HTML, CSS, and JavaScript, 2nd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.