Offline Page

When a user's device goes offline, your app will display an offline page after a configurable offline timeout threshold. This helps inform users that the app is unable to connect to the internet.

By default, the offline timeout is set to 10 seconds, but you can customize this value to suit your needs. However, increasing the timeout duration may degrade user experience, as it will delay visual feedback when the app is trying to establish a connection.

Offline Page Behavior

Enabled (Default): After the timeout, an offline page is shown.
Disabled: The app displays the last cached version of the webpage. If no cached page exists (e.g., for new users), the app will show a default browser error (iOS WKWebView or Android WebView).

Custom Offline Pages

Instead of using the default offline page, you can configure a custom offline page for both iOS and Android platforms. Since this page is shown without internet access, all assets must be self-contained:

Inline all CSS and JavaScript
Use Base64-encoded or SVG images

Custom Offline Page as Initial URL

To use a custom offline page as the app's initial launch screen, please set the initialURL in the App Configuration to file:///offline.html.

Manual Page Reload

You may also wish to include a button to manually attempt to reload the page, for instance after the user connects to WiFi or VPN. This can be implemented using the following JavaScript Bridge Commands:

↔️Median JavaScript Bridge
median.webview.reload();

Example Offline Pages

Default Offline Page

Custom Offline Page Example

Advanced Strategies

Service Workers

Implementing Service Workers on your website allows for advanced offline functionality. When integrated into your Median app, Service Workers enable offline access to cached content.

📖 Learn more: Service Workers

Native Datastore

Based on the Native Datastore Plugin you can leverage the App Storage to capture and store data when the app is offline and process and sync the saved data in your backend one the user is back online. It is imperative to use the App Storage for this functionality as the Cloud Storage will be unavailable if the device is offline.

📖 Learn more: Native Datastore Offline

Offline Download Manager

The Offline Download Manager plugin allows you to download document and rich media files to the user's device for online or offline access. Files are viewable through a built-in file manager UI as well as programmatically.

📖 Learn more: Offline Download Manager

OfflineSync

We also offer an OfflineSync solution, which is suitable if your app can function entirely without internet access - such as a sales catalog or an in-store kiosk. Please contact us if you're interested.