HTML5 Offline Application – Debug Manifest
There are many good tutorial out there to test/experiment offline application such as Dive Into HTML5. In theory, if you follow the instruction, your sample offline application can be up and running in no time. However, that wasn’t the case for me and wanted to share this experience and hoping that this might help someone else out there who is about to pull their hairs.
Debug 1: Did I set web server correctly so that manifest can be served as manifest?
To test this, you can simply run cURL as follows from terminal
curl -I url_to_your_manifest
If you see content type returned as text/cache-manifest, you are good. So this is not the problem…
Debug 2. It doesn’t seems to be all the items on manifest are downloaded successfully…
This really almost killed me. I was using FF and Safari. I know it download something but not quite complete… I used script provided by Jonathan Stark to debug. The script indicates that I might will need to check manifest.
Safari Console
Spent quite long time to make sure everything seems to be correct… still something wasn’t quite right…. I then decided to use chrome and wow… I know exactly what file is the cause. Chrome console shows progress as shown below.
Chrome Console
I finally got all the files right and now my application runs locally just fine. Yey!
In Summary, here is the list of things that you want to check for manifest/directory:
1. is file name/path correct? (case sensitivity) – to avoid this error, perhaps you should write a code to generate manifest.
2. Does it have right permission? – to avoid 403 error, perhaps you should re-apply permissions once you move the files.
That’s it for now… Now I will need to convert server side code in JavaScript to function locally.
