HTML and CSS Reference
In-Depth Information
are put in that category until the browser hits a new category.
So with that in mind, I could have written my fi le to look like the
following—and it would have the exact same effect:
CACHE MANIFEST
CACHE:
index.html
time.js
time.css
FALLBACK:
server-time.js fallback-server-time.js
# version 9
Yo u c a n r e p e a t a c a t e g To r y, t To To . To a p p e n d n e w fi l e s t To b e
included in the cache, include them at the end of the file so the
manifest reads: cache, fallback, cache. This is perfectly valid, too.
FALLBACK
tells the browser that if anything matches the URL on
the left, in my case
server-time.js
, and it's not in the manifest
and it can't be accessed with the existing connection, then
serve up the fi le specifi ed on the right side, in my case
fall-
back-server-time.js
. The fallback fi le
fallback-server-time.js
is included in the fi les that are cached by the browser, just as
fi fi e s a r e fi in t h e
CACHE
category.
FALLBACK
also allows you to use URL paths, so you could use the
following:
FALLBACK:
server-time.js fallback-server-time.js
/ offline.html
This tells the browser that if
server-time.js
is requested and
it's not available, then serve up
fallback-server-time.js
. If any
other path is requested, such as
/foo.html
, and it's not available
(either because you're offline or it's not in the cache), then serve
offline.html
. This technique could be used to allow your entire
application to work offline and wall off the areas that require the
web and notify your user via the
offline.html
page that they
need to be online to access this particular section.
Figure 7.2
shows my time application when the app doesn't have connec-
tivity to the site, and the request for
server-time.js
falls back to
fallback-server-time.js
showing an entirely different message.
NOTE
The web page that
includes the manifest (in
the
<html>
tag) is also implicitly
included in the cache manifest.
For this reason, I recommend
explicitly including the fi le,
index.html
in my case, in the
manifest so that you don't get
confused further along in the
development of your project.
