File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes HTML, CSS and JavaScript and the fly likes HTML5 Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "HTML5 "offline" support question" Watch "HTML5 "offline" support question" New topic

HTML5 "offline" support question

Toby Eggitt
Ranch Hand

Joined: Dec 08, 2004
Posts: 49
Hi all, I've been experimenting with the offline features in HTML5 on and off for a few years now. Recently, (last 12 months, perhaps) it seems to have started to work moderately well in some browsers, but I'm finding that it's still not working very reliably. Specifically, the code I have now works quite well in Chrome and Opera, but not at all in Firefox. Is this reasonable--i.e. is it plausible that Firefox doesn't implement offline correctly still, or does it indicate that my code is wrong?

I have the following:

cache.manifest (served from apache with a text/cache-manifest mime type, though lately that doesn't seem to matter like it used to)
# 2012-05-23 15:29



available.html unavailable.html


Then "offline.html".
<html manifest="cache.manifest">
<title>Run this offline</title>
var output;
var appCache = window.applicationCache;

function init() {
output = document.getElementById("output");
var online = window.navigator.onLine;

output.innerHTML = "Browser is " + (online ? "on-" : "off-") + "line.

function checkForUpdate() {
appCache.addEventListener('updateready', handleCacheEvent);

function handleCacheEvent(event) {
if (appCache.status == window.applicationCache.UPDATEREADY) {
// warn user that we're about to load the new version
alert("This site has been updated.\nInstalling changes");
appCache.swapCache(); // bring the new cache entries into play
<body onload="init()">
<h1>Offline operation-v18</h1>

<input type="button" onclick="checkForUpdate()" value="check for update"/>
<iframe src="available.html" width="300px" height="200px">No iFrames</iframe>

available.html and unavailable.html are just trivial html files that I want to have show from cache (in the case of unavailable) or from a live feed in the case of available.html

The behavior in Chrome and Opera is more or less as expected, complete with the ability to pull cache updates when clicking the "check for update" button. In those two browsers the only thing that doesn't work is the FALLBACK section of the cache. So, when the network is down, the iframe simply shows "cannot load resource" and does not use the unavailable.html fallback file. The cache does load the unavailable.html file, and does not load the available. html file, but the fallback behavior isn't working.

However, with Firefox, when I first load the app, I'm prompted about "web page wants to use storage for offline use" but the instant I disconnect, I can't reload the page in any way; it immediately and consistently shows a "cannot connect" splash.

Am I missing something, or is Firefox missing something?

Toby Eggitt
Ranch Hand

Joined: Dec 08, 2004
Posts: 49
Oh, wait, never mind. It turns out that Firefox has a specific "work offline" entry in the File menu. With that clicked, it works. Odd, I kinda expected the browser to be able to work out that it was offline from the fact that it was unable to make any network connections. Evidently that's far too complex a piece of logic!?!?

So, problem solved...
Eric Pascarello

Joined: Nov 08, 2001
Posts: 15385
I am starting to get into the offline mode stuff now with a project, reminds me of coding back in the NN4/IE5 days where you do things differently and get different results.

I agree. Here's the link:
subject: HTML5 "offline" support question
It's not a secret anymore!