Current page does not respond with a 200 when offline

Published on Updated on

The Core Progressive Web App checklist says that a PWA should provide a custom offline page. The Optimial Progressive Web App checklist says that a PWA should provide an offline experience where the PWA works the same offline as it does online (wherever network connectivity isn't strictly required).

Learn more in the What is network reliability and how do you measure it? post.

How the Lighthouse offline audit fails

Lighthouse flags pages that don't respond with an HTTP 200 response when offline:

Lighthouse audit showing page doesn't respond with a 200 when offline

Lighthouse emulates an offline connection using the Chrome Remote Debugging Protocol and then attempts to retrieve the page using XMLHttpRequest.

In the Lighthouse report UI the full PWA badge is given when you pass all of the audits in all of the PWA subcategories (Fast and reliable, Installable, and PWA optimized).

How to make your PWA work offline

Success

Workbox is the recommended approach for adding service workers to websites because it automates a lot of boilerplate, makes it easier to follow best practices, and prevents subtle bugs that are common when using the low-level ServiceWorker API directly.

  1. Add a service worker to your app.
  2. Use the service worker to cache files locally.
  3. When offline, use the service worker as a network proxy to return the locally cached version of the file.
Codelab

Learn how to add a service worker to your app with the Working with service workers codelab.

Resources

Updated on Improve article

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.