Welcome to MobiWeb!

MobiWeb is a bundle of products that aim to make a fast mobile application. All you need is a mobile-friendly website.

Mobile App

MobiWeb's core feature is to create mobile applications by just loading a website as a WebView wrapper. MobiWeb provides necessary bridges to the native system, such as notifications, microphone, and camera access.

If you're looking for fast solutions for a mobile app, you can use MobiWeb.

The native bridge layer also includes app settings shortcuts:

App info: open the app's system settings page from window.AndroidAppInfo.openAppSettings() or window.AppleAppInfo.openAppSettings()
Notifications: open notification settings from window.AndroidNotification.openNotificationSettings()

Native - Website Bridges

Notification Permission

To request for the notification permission, you can hook up a button on your website. Call the function for requesting notification permission:

Permission Request Function Call

Android: window.AndroidNotification.requestNotificationPermission
Apple: window.AppleNotification.requestNotificationPermission

Afterward, listen to the respective event (i.e., window.addEventListener('<event name>', function (e))). The event detail e.detail follows the form { granted: boolean } (i.e., { granted: true }).

Notification Permission Event

Android: mobiweb:notificationPermission
Apple: mobiweb:appleNotificationPermissionResult

For instance, for Android, you would code something like:

window.addEventListener(
  'mobiweb:notificationPermission', // use `mobiweb:appleNotificationPermissionResult` for Apple notifications
  function (e) {
    const { detail } = e;
    if (!detail) return;
    if (detail.granted) console.log('Granted');
    else console.log('Not granted');
  }
)

You should add the event listener before requesting for the notification permission, or race conditions may ensue. After retrieving the result, you may remove the event listener, or configure the event to be once.

Notification Permission Status

To check the current status without prompting the user:

Status Function Call

Android: window.AndroidNotification.getNotificationPermissionStatus()
Apple: window.AppleNotification.getNotificationPermissionStatus()

Android returns a JSON string. Apple returns a Promise that resolves the status and also emits mobiweb:appleNotificationPermissionStatus.

async function getNotificationStatus() {
  if (window.AndroidNotification) {
    return JSON.parse(window.AndroidNotification.getNotificationPermissionStatus());
  }

  if (window.AppleNotification) {
    return window.AppleNotification.getNotificationPermissionStatus();
  }

  return null;
}

const status = await getNotificationStatus();
console.log('Notifications enabled:', status && status.notificationsEnabled);
console.log('Critical alerts enabled:', status && status.criticalAlertsEnabled);

Android status includes notificationsEnabled, runtimePermissionGranted, and appNotificationsEnabled. Apple status includes notificationsEnabled, authorizationStatus, alertSetting, badgeSetting, soundSetting, criticalAlertsEnabled, and criticalAlertSetting.

Critical Alerts Permission (Apple only)

Critical Alerts are a separate permission from standard notifications and must be requested with a dedicated call. The function is always present on the shim — the entitlement is not checked client-side. Instead, when the installed build's provisioning profile lacks the com.apple.developer.usernotifications.critical-alerts entitlement, iOS reports criticalAlertSetting: 'notSupported' in the result event and the request is effectively a no-op.

Permission Request Function Call

Apple: window.AppleNotification.requestCriticalAlertsPermission

Permission Event

Apple: mobiweb:appleCriticalAlertsPermissionResult

Event detail: { granted: boolean, criticalAlertSetting?: 'enabled' | 'disabled' | 'notSupported' | 'unknown' }.

Outcome matrix:

`granted`	`criticalAlertSetting`	Meaning
`true`	`'enabled'`	User granted (or was already granted)
`false`	`'disabled'`	User declined the prompt
`false`	`'notSupported'`	Build lacks the entitlement — feature unavailable on this install
`false`	`'unknown'`/ absent	Pre-iOS-12 device, or unexpected state

window.addEventListener(
  'mobiweb:appleCriticalAlertsPermissionResult',
  function (e) {
    const { granted, criticalAlertSetting } = e.detail || {};

    if (granted) {
      console.log('Critical alerts granted');
    } else if (criticalAlertSetting === 'notSupported') {
      console.warn('Critical alerts entitlement missing in this build');
    } else {
      console.log('Critical alerts denied:', criticalAlertSetting);
    }
  },
  { once: true }
);

window.AppleNotification.requestCriticalAlertsPermission();

Add the listener before calling the request to avoid race conditions, same rule as the standard notification permission.

Retrieving Device Token

Like with requesting notification permission, you can call the function window.AndroidNotification.getFirebaseToken() to retrieve an already-existing FCM token (not applicable for Apple). However, in case a Firebase token has not been generated yet or the device token has expired (empty string), you can request a new device token using the respective function. For performance purposes, it is recommended to first get the Firebase token regardless of expiration, and only request if it has expired or the returned string is empty (only applicable for Android).

You can listen to the respective event, which would emit the detail { token: string }.

Device Tokens

Android
- Requesting FCM token: window.AndroidNotification.requestFirebaseToken()
- Token detail is emitted to the event: mobiweb:fcmToken
Apple
- Requesting FCM token: window.AppleNotification.requestToken()
- Token detail is emitted to the event: mobiweb:appleNotificationToken

Example:

window.addEventListener(
  'mobiweb:fcmToken', // `mobiweb:appleNotificationToken` for Apple
  function(e) {
    console.log('fcm token from native:', e.detail && e.detail.token);
  }
);

On New Device Tokens

It is possible for FCM to refresh FCM tokens, especially for Apple devices. In these cases, the same event for the device token will be fired, but an additional field oldtoken will be included. Thus the event detail will be { token: 'new-token', oldtoken: 'old-token' }. You can check if oldtoken is falsy.

Local Notifications From Website

You can send local notifications directly from your website using the notification bridge:

Android: window.AndroidNotification.sendLocalNotification(payload)
Apple: window.AppleNotification.sendLocalNotification(payload)

Payload supports existing notification config keys (such as title, body, sound, silent, badge, etc.), custom data, and trigger options.

const payload = {
  title: 'Payment Reminder',
  body: 'Tap to continue checkout',
  data: {
    url: 'https://example.com/checkout/123',
    orderId: '123'
  },
  trigger: {
    // immediate | delay | time | home | exit
    type: 'delay',
    delayMs: 10_000
    // delayMs also works with home and exit triggers
  }
};

window.AndroidNotification?.sendLocalNotification(payload);
window.AppleNotification?.sendLocalNotification(payload);

Trigger examples:

Immediate: omit trigger, or use { trigger: { type: 'immediate' } }
Delay: { trigger: { type: 'delay', delayMs: 5000 } }
Specific time (epoch ms): { trigger: { type: 'time', at: Date.now() + 60000 } }
On home screen: { trigger: { type: 'home' } }
On home screen with delay: { trigger: { type: 'home', delayMs: 5000 } }
On app exit: { trigger: { type: 'exit' } }
On app exit with delay: { trigger: { type: 'exit', delayMs: 5000 } }

data.url is supported and will open the passed URL when the user taps the notification (same as existing notification-tap URL behavior).

MobiWeb now exposes Android native sharing via:

Direct bridge: window.AndroidShare.share(payloadJson)
Auto Web Share shim: navigator.share(...) and navigator.canShare(...) are injected if missing.

This means websites that already use Web Share API can trigger native sharing without website modifications.

Share text/URL:

await navigator.share({
  title: 'Order #1234',
  text: 'Check this order',
  url: 'https://example.com/orders/1234'
});

Share files:

const blob = await fetch('/invoice.pdf').then(r => r.blob());
const file = new File([blob], 'invoice.pdf', { type: 'application/pdf' });

await navigator.share({
  title: 'Invoice',
  files: [file]
});

Clearing Cookies

You can call the respective bridge function to clear the cookies from the WebView wrapper.

The function accepts a single boolean parameter. If true, MobiWeb redirects to the initial URL if cookies were cleared successfully. If false, MobiWeb will just simply clear cookies without redirecting to the app's initial URL.

You will get the result with the emitted event value with shape { detail: { success: <boolean> } }

Clearing Cookies

Android
- Call the function: window.AndroidCookie.clearCookies(true)
- Listen to the event: mobiweb:cookiesCleared
Apple
- Call the function: window.AppleCookie.clearCookies(true)
- Listen to the event: mobiweb:appleClearCookies

21 May 2026

Welcome to MobiWeb!

Mobile App

Native - Website Bridges

Notification Permission

Notification Permission Status

Critical Alerts Permission (Apple only)

Retrieving Device Token

On New Device Tokens

Local Notifications From Website

Native Share Sheet (Android)

Clearing Cookies