You can now deliver browser web push notifications in supported browsers (such as Chrome) using Blueshift's Cloud App capability along with a web push SDK provider such as OneSignal. Web push notifications can be orchestrated in campaign journeys and can leverage predictive content recommendations as well as other personalizations. Web push engagement data such as impressions and clicks can be captured via callback urls in Blueshift journeys.

In order to use this capability, you must sign up for browser web notifications at and use the relevant credentials with your Cloud App template within Blueshift.

Before you begin

Before you can set up integration with Blueshift, you must have your OneSignal account set up.

Complete the following settings in OneSignal before you set up integration with Blueshift:

Setup a web push app in OneSignal

Before you can integrate with Blueshift, you must have your OneSignal account set up. Follow the steps outlined in this OneSignal document to setup a Web Push app in OneSignal.

To integrate with Blueshift, you need the API Key and the APP ID.

  1. To find the Rest API key, sign in to your OneSignal account and click on your site or app under All Applications on the home page.


  2. After you enter your application/site's page, click on your profile picture in the upper right corner > Account & API keys


  3. Copy the API key from the REST API Keys section of the Account Management page that appears.


You must also specify the APP ID in the message template that you use to send the messages to OneSIgnal.

  1. To get the app ID, sign in to your OneSignal account, click on the app or site that you have added to your OneSignal account.


  2. The application/site's dashboard opens. Copy the application ID from the URL bar of the dashboard page.


Add the OneSignal Javascript code to your website

Save the user’s OneSignal user ID (also called player id) on a Blueshift user profile with an identify event.

This would fire an identify event with onesignal_webpush_id set to the OneSignal user identifier that would be needed for sending out the Web Push message via OneSignal.


<!-- Web Push notification test with Blueshift + OneSignal. This records the OneSignal user ID (or player ID) and sends it to us. -->
OneSignal.push(function() {
  OneSignal.getUserId(function(userId) {
   console.log("OneSignal User ID:", userId);
     email: "<<User Email>>",
     onesignal_webpush_id: userId

Collect engagement data back from OneSignal

After the integration of OneSignal with Blueshift, you can send a notification from the Blueshift platform to the customers of your site through OneSignal.

OneSignal can issue webhook callbacks to a server on message engagement such as impressions or clicks. You can collect these webhook callbacks and send these back to Blueshift as events for segmentation. For more information, see Web Push Webhooks on OneSignal documentation.

In order to use this, you must setup webhook callback urls to your server/app, and once you receive the callback, use the relevant URL in the "data" section to call Blueshift for the engagement tracking. 

Use the webhook URL provided by Blueshift to track a customer impression or click.

Connect the webhook trigger to OneSignal

  1. Sign in to the OneSignal account and click on the app/site that you integrate with Blueshift.
  2. On the dashboard of the application, click Settings
  3. Choose All Browsers (except Safari) under Web Push Platforms.
  4. Enable Webhooks in the Webhooks section under Advanced, and provide the webhook URL in the following fields:
  5. Click Save.

Set up integration

To add a OneSignal adapter in Blueshift, complete the following steps:

  1. Sign in to the Blueshift app, and click Apps in the left navigation menu.
  2. Go to All Apps, search for, and select OneSignal.
  3. You can also go to Web Push Apps and select OneSignal.
  4. Click Configure to view all the configured adapters.
  5. Click +ADAPTER to add an adapter.


  6. Add a Name for the adapter. If you have multiple adapters, the adapter name helps you to identify the integration.
  7. Provide the API Key.
  8. Add information for any Additional Headers.
  9. Click Save to add the adapter.

    The adapter is now added and you can use it in your Cloud App template.

Next steps

  1. Create a OneSignal cloud app template to send a payload from a campaign.
  2. Verify integration
  3. In your campaign journey, add a OneSignal trigger. Select the template that you created.

Create a OneSignal cloud app template

A Cloud App template is required to send a payload to OneSignal from a campaign.

To add a OneSignal Cloud App template, complete the following steps:

  1. Go to Creatives > Cloud App.
  2. Click +TEMPLATES on the Cloud App Templates page.
  3. Select the OneSignal app.

    Note: Only apps that support Cloud Apps templates and have atleast one adapter configured are displayed on the Cloud App Templates page.

  4. Configure the template including the name, tags and other relevant information. For more information, see Cloud Apps templates.


    Field Description
    Template Name Specify a name for the template to identify it on the index screen. 
    API Endpoint Specify the API endpoint that receives the request that we make. 
    Adapter Select the adapter to use to send the payload.

    Specify tags to organize this template.

    Since this template is a Blueshift resource that you use in campaigns, you can use tagging to organize it under folders.

    For more information on this, see Tagging.

  5. On the Content tab, fill the form to specify the data and the format in which to send the data to OneSignal. 

    You can also switch to JSON and specify the content in JSON format. However, once you switch to JSON, you cannot use the form layout again.


  6. Provide the APP ID as the value of the app_id key in the source JSON.
  7. For the include_player_ids key, if you are setting the value of the user attribute as onesignal_webpush_id ({{user.extended_attributes.onesignal_webpush_id}} value in the example JSON), ensure that the custom attribute that you add to your users is also onesignal_webpush_id. If these two attributes do not match, Blueshift cannot update a user's webpush ID on the platform.


Verify integration

  1. Load your website that integrates with OneSignal’s SDK and requests for the notification permission. You would need to click on the notification icon and grant permissions.

  2. On the user profile in Blueshift, you should see a onesignal_webpush_id. For example:


  3. Issue a Test Push via Cloud App

    You should see a personalized web push delivered via OneSignal such as:


Was this article helpful?
0 out of 0 found this helpful



Please sign in to leave a comment.