Using Wildcard in FALLBACK section of Cache manifest file HTML5

How to create an offline enabled web-application such that when user visits hxxp://mywebsite/ and is offline than hxxp://mywebsite/offline/ is d开发者_StackOverflow社区isplayed. [There are about 100 different dynamic pages in my website, so I cannot afford to hardcode all of them in the cache manifest file]

I reference "manifest.php" instead of "cache.manifest", then my php file looks like this:

<?php
    header('Content-Type: text/cache-manifest');
    echo "CACHE MANIFEST\n";

    $hashes = "";

    $dir = new RecursiveDirectoryIterator(".");
    foreach(new RecursiveIteratorIterator($dir) as $file) {
        $info = pathinfo($file);
        if ($file->IsFile() &&
            $file != "./manifest.php" &&
            substr($file->getFilename(), 0, 1) != ".")
        {
            echo $file . "\n";
            $hashes .= md5_file($file);
        }
    }

    echo "# Hash: " . md5($hashes) . "\n";

?>

The file hashes keep it up-to-date so that if any files change the manifest changes as well. Hope that helps :)

CACHE MANIFEST
CACHE:
/Offline/OfflineIndex.html

FALLBACK:
/ /Offline/OfflineIndex.html

NETWORK:
*

This will cause all your pages across the entire site to redirect to offline when offline. The only issue is with the page that declares the manifest as that page is always cached. This means you cannot declare the manifest on every page because every visited page will then be cached itself and not redirect. So what you can do is declare your manifest on another html file (IE. Synchronize.html) then from default check whether or not your app has been made available for offline by storing a cookie or localcache value. If not redirect to synchronize.html with the manifest declared, set the localcache value, and redirect back to index.

OFFLINE AWESOMENESSSSSSSSSSS!!!!

It's not possible to use wildcards in the cache manifest, at least it doesn't work in any current browser as far as I'm aware. An alternative approach might be to generate your cache manifest dynamically, and let a script generate all those fallback entries.

Reference your manifest file in an invisible iframe in your index page. That way your index page isn't cached as it is normally by default and you have total control over your fallbacks...

No need for unreliable cookies or localStorage!