Send a push notification

Code Library
1

PRE-REQUISITES

For the following code examples to work, you will need to add the fliplet-notifications library to your app. To add it follow these steps:

  1. When in Fliplet Studio’s Edit screen, open the Developer Options from the right hand menu
  2. With the Developer Options open, click the Libraries button in the top right corner
  3. In the search field, type in ‘fliplet-notifications’
  4. Click it to add it to the list
  5. Click Save

Documentation: Notifications JS APIs | Fliplet Developers Documentation

There are 2 types of notifications:

  1. In app notifications - These appear only in the notification inbox inside the app.
  2. Push notification - There appear on your mobile device’s lock screen.

You can choose to send either type of notification or send both at the same time.

In-app notification only

JavaScript

var instance = Fliplet.Notifications.init({});
instance.insert({
  status: 'published',
  data: {
    title: 'Greetings',
    message: 'Hi John!',
     //Optional setting to link the notification to a screen inside the app
    navigate: {
      action: 'screen',
      page: 123,
      query: '?weather=sunny'
    }
  },
  scope: {
    Email: 'john@example.org'
  }
})

Push notification only

JavaScript

var instance = Fliplet.Notifications.init({});
instance.insert({
  type: 'push',
  pushNotification: {
    payload: {
      title: 'Title of the push notification',
      body: 'Message of the push notification',
      custom: {
        // Add a link to the push notification
        customData: {
          action: 'screen',
          page: 123,
          query: '?weather=sunny'
        }
      }
    },
  },
  scope: {
    Email: 'john@example.org'
  }
})

Both types at the same time

JavaScript

var instance = Fliplet.Notifications.init({});
instance.insert({
    data: {
      title: 'Greetings',
      message: 'Hi John!',
      navigate: {
        action: 'screen',
        page: 123,
        query: '?weather=sunny'
      }
    },
  
    // Also send a push notification
    pushNotification: {
      payload: {
        title: 'Title of the push notification',
        body: 'Message of the push notification',
        custom: {
          // Add a link to the push notification
          customData: {
            action: 'screen',
            page: 123,
            query: '?weather=sunny'
          }
        }
      },
    },
    scope: {
      Email: 'john@example.org'
    }
  })

If you want to link to an external link instead of a screen you need to use this syntax

JavaScript

var instance = Fliplet.Notifications.init({});

instance.insert({
  status: 'published',
  data: {
    title: 'Greetings',
    message: 'Hi John!',
    //add a link to the in app notification
    navigate: {
      action: 'url',
      url: 'https://www.google.com/'
    }
  },

  // Also send a push notification
  pushNotification: {
    payload: {
      title: 'Title of the push notification',
      body: 'Message of the push notification',
      custom: {
        // Add a link to the push notification
        customData: {
          action: 'url',
          url: 'https://www.google.com/'
        }
      }
    }
  }
});
1 Like