• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
  • Campbell Ritchie
  • Ron McLeod
  • Paul Clapham
  • Bear Bibeault
  • Junilu Lacar
  • Jeanne Boyarsky
  • Tim Cooke
  • Henry Wong
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Tim Holloway
  • salvin francis
  • Frits Walraven
  • Scott Selikoff
  • Piet Souris
  • Carey Brown

HTML5 "offline" support question

Ranch Hand
Posts: 73
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
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
Posts: 73
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
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...
Posts: 15385
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
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.

"Don't believe every tiny ad you see on the internet. But this one is rock solid." - George Washington
Thread Boost feature
    Bookmark Topic Watch Topic
  • New Topic