HTML and CSS Reference
In-Depth Information
In addition to the
CACHE
and
FALLBACK
categories, there's the
NETWORK
category, which already has entries associated with it in
our example. This is the whitelist category, and what's important
about these entries is that they tell the browser that any requests
to any asset that isn't in our offline cache should go via the Web.
If you're like me, you're probably thinking, “Surely that's the
default?” I'm afraid not. If the browser is viewing a page that's
running from the AppCache, that is, the page was served up
from the manifest, then all resources on that page must match
some rule in the manifest; otherwise, they fail to load. This
seems odd, but the rule we've already added ensures that we'll
never get burnt by this odd behaviour.
We could include more specific URLs, but by putting the * rule in
it ensures that everything else goes via the Web, and we don't
end up with any ugly old broken images.
Providing fallback content
Both with the FALLBACK and the NETWORK namespaces,
there's no pattern matching support—though you might think
this if you were looking at an example manifest file with a * char-
acter in it; in fact this is a special character that we'll look at in
the network whitelist section below.
FALLBACK works by specifying a resource location, or a
resource prefix, that is, what the URL starts with. Note that there
are no regexes going on here; it's just “does it start with....”
When your website is offline, and you're using the AppCache,
you could direct all the requests to the payment.html page to an
offline version of the page using the following:
FALLBACK
payment.html payment-offline.html
However, if your site requests /money/payment.html this rule will
not match, but we can match on the start of the URL like this:
FALLBACK
/money/ payment-offline.html
Now any request that starts with /money/ for a URL whilst we're
offline and whilst the URl is unavailable in the cache will have
the payment-offline.html served up instead.
