This is basically identical to these unanswered SO questions: Offline Web App doesn't cache in Firefox, but fine in Chrome
I am having the same problem and I will provide a little more information, because it can help someone who is trying to figure out the secret puzzles and pitfalls of trying to implement the cache manifest.
Problem: reload / refresh the page and the page should reload from the offline cache, but this is not the case.
It works fine in Chrome 23: when I disconnect from the Internet and refresh the page, it loads normally, and the Application Cache NoUpdate event is displayed on the console.
However, Firefox 15.0.1 shows me my 404 page.
Troubleshooter (Firefox): Go to Firebug and click DOM and then applicationCache. The status shows 0, which means "unencrypted" (the page was not saved offline).
Troubleshooter (Firefox): Choose Firefox Options → Advanced and view offline web content and user data. It shows that my domain uses 1.4 MB of data for offline use. (This is a good place to check if your page has been cached).
Troubleshooter (Firefox): Open a new tab and go to: cache. Here you should see the header for a standalone caching device. Here you can see the Cache directory where your offline cache files are stored. If you click on Cache List Items, you will see the files in your offline cache.
There are two things that seem strange to me here: 1) that when I click on any of the files in the list, it goes to a blank page that says: "Information about the cache entry. The cache you selected, not available". However, files exist and are not populated in the Cache Directory. 2) Although all files from the cache manifest are specified, the page that I call is not listed here (in Chrome DevTools, it appears in the manifest as the Wizard: it is cached automatically even if it is not explicitly specified in the cache manifest file).
Here is what I see when I'm online: when the cache is cold (empty), when I load the page, the console shows checks, loading, progress and cached events, but the cache status is not closed. Basically, cache files are downloaded, but they cannot be accessed. Firebug DOM applicationCache says: 0 items in a standalone cache (this contradicts what is shown roughly: cache and Options → Advanced). The state is 1, which means idle. When I look at the Net tab in Firebug online, it shows a GET request for a page with a 200 OK response. Installing Expires shows cf. December 31, 1969, which, I think, means that the page will always be checked out. Other files show a 304 Not Modified answer, which means that they are loaded from the browser’s cache and not the offline cache (Chrome’s similar response for these files is 200 OK (from the cache), which means they are downloaded from the offline cache, not browser cache).
When I'm online: with the uncached cache, the GET request fails, and it loads a stand-alone 404 backup page with a 200 OK response (BFCache).
It seems that the offline cache is loaded because it physically exists on disk and progress events are displayed on the console, but Firefox never fires a cached event, so some of the resources have not been successfully loaded. All files are in png, js or php format, so there are no crazy file formats. Chrome loads the exact files into the cache without any problems. I also tried mobile Safari and it successfully reloads the page from the offline cache.
Are there any known issues with Firefox not caching certain file types? I am using the .html.php extension for some of my files. I also generate the manifest dynamically using a php file, so it only gets the files that exist and it hashes them in order to detect changes and update the manifest.
Next steps: I will try the manifest for bare-bones to see if I can make it work and then add files one by one to see which file is causing the error. Perhaps Firefox doesn't like that I dynamically generate a cache manifest instead of manually updating a static file?
I learned a lot about the secret intricacies of the cache manifest, but I'm more of a hacker than a computer expert. Has anyone else experienced this quirkiness with Firefox?
Top of Page:
<!DOCTYPE html> <html manifest="/directory/manifest.php">
and then manifest.php just
header('Content-Type: text/cache-manifest'); echo "CACHE MANIFEST\n";
etc .. etc It uses the RecursiveDirectoryIterator to retrieve all the files in the directory (except the cache itself, which is enabled by default).