Have ideas to improve npm?Join in the discussion! »

    @capacitor/push-notifications
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.1 • Public • Published

    @capacitor/push-notifications

    The Push Notifications API provides access to native push notifications.

    Install

    npm install @capacitor/push-notifications
    npx cap sync

    iOS

    On iOS you must enable the Push Notifications capability. See Setting Capabilities for instructions on how to enable the capability.

    After enabling the Push Notifications capability, add the following to your app's AppDelegate.swift:

    func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
      NotificationCenter.default.post(name: .capacitorDidRegisterForRemoteNotifications, object: deviceToken)
    }
    
    func application(_ application: UIApplication, didFailToRegisterForRemoteNotificationsWithError error: Error) {
      NotificationCenter.default.post(name: .capacitorDidFailToRegisterForRemoteNotifications, object: error)
    }

    Android

    The Push Notification API uses Firebase Cloud Messaging SDK for handling notifications. See Set up a Firebase Cloud Messaging client app on Android and follow the instructions for creating a Firebase project and registering your application. There is no need to add the Firebase SDK to your app or edit your app manifest - the Push Notifications provides that for you. All that is required is your Firebase project's google-services.json file added to the module (app-level) directory of your app.

    Variables

    This plugin will use the following project variables (defined in your app's variables.gradle file):

    • $firebaseMessagingVersion version of com.google.firebase:firebase-messaging (default: 21.0.1)

    Push Notifications icon

    On Android, the Push Notifications icon with the appropriate name should be added to the AndroidManifest.xml file:

    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@mipmap/push_icon_name" />

    If no icon is specified Android will use the application icon, but push icon should be white pixels on a transparent backdrop. As the application icon is not usually like that, it will show a white square or circle. So it's recommended to provide the separate icon for Push Notifications.

    Android Studio has an icon generator you can use to create your Push Notifications icon.

    Push notifications appearance in foreground

    On iOS you can configure the way the push notifications are displayed when the app is in foreground.

    Prop Type Description Since
    presentationOptions PresentationOption[] This is an array of strings you can combine. Possible values in the array are: - badge: badge count on the app icon is updated (default value) - sound: the device will ring/vibrate when the push notification is received - alert: the push notification is displayed in a native dialog An empty array can be provided if none of the options are desired. Only available for iOS. 1.0.0

    Examples

    In capacitor.config.json:

    {
      "plugins": {
        "PushNotifications": {
          "presentationOptions": ["badge", "sound", "alert"]
        }
      }
    }

    In capacitor.config.ts:

    /// <reference types="@capacitor/push-notifications" />
    
    import { CapacitorConfig } from '@capacitor/cli';
    
    const config: CapacitorConfig = {
      plugins: {
        PushNotifications: {
          presentationOptions: ["badge", "sound", "alert"],
        },
      },
    };
    
    export = config;

    Silent Push Notifications / Data-only Notifications

    iOS

    This plugin does not support iOS Silent Push (Remote Notifications). We recommend using native code solutions for handling these types of notifications, see Pushing Background Updates to Your App.

    Android

    This plugin does support data-only notifications, but will NOT call pushNotificationReceived if the app has been killed. To handle this scenario, you will need to create a service that extends FirebaseMessagingService, see Handling FCM Messages.

    Common Issues

    On Android, there are various system and app states that can affect the delivery of push notifications:

    • If the device has entered Doze mode, your application may have restricted capabilities. To increase the chance of your notification being received, consider using FCM high priority messages.
    • There are differences in behavior between development and production. Try testing your app outside of being launched by Android Studio. Read more here.

    API

    register()

    register() => Promise<void>

    Register the app to receive push notifications.

    This method will trigger the 'registration' event with the push token or 'registrationError' if there was a problem. It does prompt the user for notification permissions, use requestPermissions() first.

    Since: 1.0.0


    getDeliveredNotifications()

    getDeliveredNotifications() => Promise<DeliveredNotifications>

    Get a list of notifications that are visible on the notifications screen.

    Returns: Promise<DeliveredNotifications>

    Since: 1.0.0


    removeDeliveredNotifications(...)

    removeDeliveredNotifications(delivered: DeliveredNotifications) => Promise<void>

    Remove the specified notifications from the notifications screen.

    Param Type
    delivered DeliveredNotifications

    Since: 1.0.0


    removeAllDeliveredNotifications()

    removeAllDeliveredNotifications() => Promise<void>

    Remove all the notifications from the notifications screen.

    Since: 1.0.0


    createChannel(...)

    createChannel(channel: Channel) => Promise<void>

    Create a notification channel.

    Only available on Android O or newer (SDK 26+).

    Param Type
    channel Channel

    Since: 1.0.0


    deleteChannel(...)

    deleteChannel(channel: Channel) => Promise<void>

    Delete a notification channel.

    Only available on Android O or newer (SDK 26+).

    Param Type
    channel Channel

    Since: 1.0.0


    listChannels()

    listChannels() => Promise<ListChannelsResult>

    List the available notification channels.

    Only available on Android O or newer (SDK 26+).

    Returns: Promise<ListChannelsResult>

    Since: 1.0.0


    checkPermissions()

    checkPermissions() => Promise<PermissionStatus>

    Check permission to receive push notifications.

    Returns: Promise<PermissionStatus>

    Since: 1.0.0


    requestPermissions()

    requestPermissions() => Promise<PermissionStatus>

    Request permission to receive push notifications.

    Returns: Promise<PermissionStatus>

    Since: 1.0.0


    addListener('registration', ...)

    addListener(eventName: 'registration', listenerFunc: (token: Token) => void) => Promise<PluginListenerHandle> & PluginListenerHandle

    Called when the push notification registration finishes without problems.

    Provides the push notification token.

    Param Type
    eventName 'registration'
    listenerFunc (token: Token) => void

    Returns: Promise<PluginListenerHandle> & PluginListenerHandle

    Since: 1.0.0


    addListener('registrationError', ...)

    addListener(eventName: 'registrationError', listenerFunc: (error: any) => void) => Promise<PluginListenerHandle> & PluginListenerHandle

    Called when the push notification registration finished with problems.

    Provides an error with the registration problem.

    Param Type
    eventName 'registrationError'
    listenerFunc (error: any) => void

    Returns: Promise<PluginListenerHandle> & PluginListenerHandle

    Since: 1.0.0


    addListener('pushNotificationReceived', ...)

    addListener(eventName: 'pushNotificationReceived', listenerFunc: (notification: PushNotificationSchema) => void) => Promise<PluginListenerHandle> & PluginListenerHandle

    Called when the device receives a push notification.

    Param Type
    eventName 'pushNotificationReceived'
    listenerFunc (notification: PushNotificationSchema) => void

    Returns: Promise<PluginListenerHandle> & PluginListenerHandle

    Since: 1.0.0


    addListener('pushNotificationActionPerformed', ...)

    addListener(eventName: 'pushNotificationActionPerformed', listenerFunc: (notification: ActionPerformed) => void) => Promise<PluginListenerHandle> & PluginListenerHandle

    Called when an action is performed on a push notification.

    Param Type
    eventName 'pushNotificationActionPerformed'
    listenerFunc (notification: ActionPerformed) => void

    Returns: Promise<PluginListenerHandle> & PluginListenerHandle

    Since: 1.0.0


    removeAllListeners()

    removeAllListeners() => Promise<void>

    Remove all native listeners for this plugin.

    Since: 1.0.0


    Interfaces

    DeliveredNotifications

    Prop Type Since
    notifications PushNotificationSchema[] 1.0.0

    PushNotificationSchema

    Prop Type Description Since
    title string The notification title. 1.0.0
    subtitle string The notification subtitle. 1.0.0
    body string The main text payload for the notification. 1.0.0
    id string The notification identifier. 1.0.0
    badge number The number to display for the app icon badge. 1.0.0
    notification any 1.0.0
    data any 1.0.0
    click_action string 1.0.0
    link string 1.0.0
    group string Set the group identifier for notification grouping Only available on Android. Works like threadIdentifier on iOS. 1.0.0
    groupSummary boolean Designate this notification as the summary for an associated group. Only available on Android. 1.0.0

    Channel

    Prop Type Description Since
    id string The channel identifier. 1.0.0
    name string The human-friendly name of this channel (presented to the user). 1.0.0
    description string The description of this channel (presented to the user). 1.0.0
    sound string The sound that should be played for notifications posted to this channel. Notification channels with an importance of at least 3 should have a sound. The file name of a sound file should be specified relative to the android app res/raw directory. 1.0.0
    importance Importance The level of interruption for notifications posted to this channel. 1.0.0
    visibility Visibility The visibility of notifications posted to this channel. This setting is for whether notifications posted to this channel appear on the lockscreen or not, and if so, whether they appear in a redacted form. 1.0.0
    lights boolean Whether notifications posted to this channel should display notification lights, on devices that support it. 1.0.0
    lightColor string The light color for notifications posted to this channel. Only supported if lights are enabled on this channel and the device supports it. Supported color formats are #RRGGBB and #RRGGBBAA. 1.0.0
    vibration boolean Whether notifications posted to this channel should vibrate. 1.0.0

    ListChannelsResult

    Prop Type Since
    channels Channel[] 1.0.0

    PermissionStatus

    Prop Type Since
    receive PermissionState 1.0.0

    PluginListenerHandle

    Prop Type
    remove () => Promise<void>

    Token

    Prop Type Since
    value string 1.0.0

    ActionPerformed

    Prop Type Since
    actionId string 1.0.0
    inputValue string 1.0.0
    notification PushNotificationSchema 1.0.0

    Type Aliases

    Importance

    1 | 2 | 3 | 4 | 5

    Visibility

    -1 | 0 | 1

    PermissionState

    'prompt' | 'prompt-with-rationale' | 'granted' | 'denied'

    Install

    npm i @capacitor/push-notifications

    DownloadsWeekly Downloads

    4,421

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    95.7 kB

    Total Files

    27

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar