navigator.onLine in Chrome Dev channel

Published on Updated on

With the offline APIs in HTML5, there's no excuse not to provide a flawless offline experience for users. One thing that can help this story is the navigator.onLine property; a feature that recently landed in Chrome dev channel. This property returns true or false depending on whether or not the app has network connectivity:

if (navigator.onLine) {
console.log('ONLINE!');
} else {
console.log('Connection flaky');
}

A web app can also listen for online and offline events to determine when the connection is available again or when an app goes offline:

window.addEventListener('online', function(e) {
// Re-sync data with server.
}, false);

window.addEventListener('offline', function(e) {
// Queue up events for server.
}, false);

I've posted a working demo at http://html5-demos.appspot.com/static/navigator.onLine.html and more information on offline events can be found in the MDN.

Last updated: Improve article

We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.