MobiWeb Help

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.

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.

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).

Native Share Sheet (Android)

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

03 May 2026