Offline Mode
Read offline state and control the cache
Overview
Displays a cached page when there is no network connection, and lets you control offline mode from JavaScript. Android and iOS use the same JS API.
| Feature | Android | iOS |
|---|---|---|
| Read offline state | ✓ | ✓ |
| Control offline mode | ✓ | ✓ |
| Cache control | ✓ | ✓ |
Supported Plan: Basic and above
Reading Offline State
Read whether offline mode is currently active with cache.getOfflineMode(), synchronously.
const isOffline = window.unveilyBridge.cache.getOfflineMode(); // boolean
if (isOffline) {
showOfflineBanner();
}The same value is also included as the isOffline field in the app.getInfo response.
window.unveilyBridge.app.getInfo("onAppInfo");
function onAppInfo(info) {
console.log(info.isOffline); // boolean
}Offline state is polled
The SDK does not fire a global event for network changes. Query the state directly with getOfflineMode() or getInfo() whenever you need it (e.g. on screen entry, or when a request fails).
setOfflineMode
Explicitly enable or disable offline mode. The first argument is a boolean; you may optionally pass the name of a result callback (a string) as the second argument.
// Turn offline mode on
window.unveilyBridge.cache.setOfflineMode(true);
// Pass a callback name to receive the result
window.unveilyBridge.cache.setOfflineMode(true, "onOfflineModeResult");
function onOfflineModeResult(result) {
console.log(result.enabled); // boolean — the applied state
console.log(result.success); // boolean — whether it succeeded
// On failure, result.error contains the reason
}If you omit the callback name, the default onOfflineModeResult is used.
Offline Fallback Page Setup
Configure the page to show when there is no network in assets/config.json.
{
"offline": {
"enabled": true,
"fallbackPage": "offline.html"
}
}Create app/src/main/assets/offline.html. Since the SDK does not fire network-change events, use a retry button to reload the page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Offline</title>
</head>
<body>
<h1>Please check your internet connection</h1>
<p>Once your network is restored, press the button below to try again.</p>
<button type="button" onclick="window.location.reload()">Try again</button>
</body>
</html>Cache Control
clearCache
Clears the WebView cache. Use this when you need to force a refresh after an app update. The argument is a boolean; passing true reloads the page after clearing the cache.
window.unveilyBridge.cache.clearCache(true); // clear then reload
window.unveilyBridge.cache.clearCache(false); // clear only