Documentation

OneSignal Integration

Complete setup guide for push notifications

OneSignal enables you to send push notifications to your app users. This guide covers both the initial setup and the JavaScript integration for user identification.

Prerequisites

  • OneSignal Account: Create a free account at onesignal.com
  • iOS: Apple Developer Program membership ($99/year)
  • Android: Firebase project (free)

Step 1: Create a OneSignal App

  1. Go to onesignal.com and sign in.
  2. Click New App/Website.
  3. Enter your app name and select Mobile App.
  4. Configure platforms:
    • iOS: Upload your APNs Authentication Key (.p8 file) or certificate
    • Android: Enter your Firebase Server Key and Sender ID
  5. Copy your OneSignal App ID (UUID format).

Step 2: Configure in WebToApp

  1. Go to your app's Integrations tab.
  2. Unlock the OneSignal add-on (requires credits).
  3. Toggle it ON.
  4. Paste your OneSignal App ID.
  5. Save and request a new build.

iOS: One-Time App Group Setup

For iOS builds, you must create a shared App Group in the Apple Developer Portal. This is a one-time setup that enables all WebToApp apps to receive rich push notifications.

  1. Go to Apple Developer Portal → App Groups
  2. Click the (+) button to register a new App Group
  3. Enter:
    • Description: WebToApp OneSignal Group
    • Identifier: group.app.webtoapp.onesignal
  4. Click Continue → Register

Once created, this App Group works for all your WebToApp apps automatically.

JavaScript Bridge Integration

Link your website's user accounts with OneSignal devices to send targeted push notifications.

Login User

When a user logs into your website, send their ID to the app to register them with OneSignal.

window.FlutterWebView.postMessage(JSON.stringify({
    type: 'userId',
    userId: 'user_12345'
}));

User Tags

Set tags for user segmentation (e.g., membership level, preferences).

window.FlutterWebView.postMessage(JSON.stringify({
    type: 'userTags',
    tags: {
        plan: 'premium',
        country: 'US',
        notifications_enabled: 'true'
    }
}));

Logout

When the user logs out, clear their OneSignal registration.

window.FlutterWebView.postMessage(JSON.stringify({
    type: 'userId',
    userId: null
}));

Opening URLs from Notifications

When sending a notification from OneSignal, include a URL in the additional data to open a specific page:

{
    "additionalData": {
        "openUrl": "https://yoursite.com/specific-page"
    }
}
WebToApp - Convert Any Website to iOS & Android Apps