Push Notifications for the Capacitor Plugin

Platform Setup

Before you can send and receive push notifications, you need to configure your app for the platform(s) you’re targeting. Follow the platform-specific setup instructions below.

iOS

Enable Push Notifications Capability

1. Open your project in Xcode.

2. Click on your project in the Project Navigator.

3. Select your main app target and then click the Signing & Capabilities tab.

4. If you do not see Push Notifications enabled, click + Capability and add Push Notifications.

   

Enable Background Modes

1. Select your main app target and then click the Signing & Capabilities tab.

2. Click + Capability and add Background Modes.

   

3. In the Background Modes section, select the Remote notifications checkbox.

   

Notification Service Extension

To take advantage of notification attachments, such as images, animated gifs, and video, you will need to create a notification service extension .

Android

Configure Firebase Cloud Messaging (FCM) or Huawei Mobile Services (HMS) to enable push notifications on Android.

FCM Setup

Follow the Android FCM setup instructions.

HMS Setup

1. Follow Huawei’s documentation  to set up the HMS SDK.

    Note

   Airship requires HMS Core Push SDK 6.3.0.304 or newer.

2. Add airshipHmsEnabled=true to the app’s gradle.properties.

Notification Configuration

Configure the notification icon and accent color in your takeOff config:

await Airship.takeOff({
  production: {
    appKey: "<APP_KEY>",
    appSecret: "<APP_SECRET>"
  },
  development: {
    appKey: "<APP_KEY>",
    appSecret: "<APP_SECRET>"
  },
  inProduction: true, 
  site: "us",
  android: {
      notificationConfig: {
          icon: "ic_notification",
          accentColor: "#00ff00"
      }
  }
})

See the Capacitor Plugin Setup guide for complete takeOff configuration options.

Enable User Notifications

The Airship SDK distinguishes between user notifications (visible to users) and silent push notifications (background data delivery). User notifications require explicit permission from the user.

By default, user notifications are disabled. Enable them when you want to show visible notifications to users.

Basic Enablement

The simplest way to enable user notifications is with setUserNotificationsEnabled():

await Airship.push.setUserNotificationsEnabled(true)

This will prompt the user for permission if not already granted. However, it does not provide feedback on whether the user accepted or denied the permission.

Async Enablement with Fallback

For more control over the permission flow, use enableUserNotifications() which returns the permission result and supports a fallback option:

// Enable with system settings fallback
const granted = await Airship.push.enableUserNotifications({
  fallback: "systemSettings"
})

if (granted) {
  console.log('Notifications enabled')
} else {
  console.log('Notifications denied')
}

The systemSettings fallback option will prompt the user to open system settings if permission is denied on iOS or denied silently on Android. This gives users a second chance to enable notifications if they initially declined.

Checking Notification Status

To check if user notifications are currently enabled:

const enabled = await Airship.push.isUserNotificationsEnabled()

For more detailed status information, use getNotificationStatus():

const status = await Airship.push.getNotificationStatus()
console.log('Are notifications allowed:', status.areNotificationsAllowed)
console.log('Is opted in:', status.isOptedIn)

To monitor notification status changes in real-time:

const handle = await Airship.push.onNotificationStatusChanged(event => {
  console.log('Notification status changed:', event.status)
  console.log('Is opted in:', event.status.isOptedIn)
})

Getting the Push Token

To get the platform-specific push token (APNs token on iOS, FCM token on Android):

const token = await Airship.push.getPushToken()

// Or listen for token updates
const handle = await Airship.push.onPushTokenReceived(event => {
  console.log('Push token:', event.pushToken)
})