HTML5 の オフライン API があれば、ユーザーに完璧なオフライン エクスペリエンスを提供しない理由はありません。このストーリーに役立つ機能として、navigator.onLine プロパティがあります。これは、最近 Chrome Dev チャンネルにリリースされた機能です。このプロパティは、アプリにネットワーク接続があるかどうかに応じて、true または false を返します。
if (navigator.onLine) {
console.log('ONLINE!');
} else {
console.log('Connection flaky');
}
ウェブアプリは、online イベントと offline イベントをリッスンして、接続が再び利用可能になったときやアプリがオフラインになったときを判断することもできます。
window.addEventListener('online', function(e) {
// Re-sync data with server.
}, false);
window.addEventListener('offline', function(e) {
// Queue up events for server.
}, false);
動作するデモを http://html5-demos.appspot.com/static/navigator.onLine.html に投稿しました。オフライン イベントについて詳しくは、MDN をご覧ください。