[vc_row][vc_column][vc_column_text]Our web push notifications SDK enables your website to send push notifications to your user base. Almost all modern browsers are supported on most platforms, except iOS.

[table id=6 /]

You can find the source code for our push notifications web SDK here.

Getting Started

Follow these instructions to set web-based push notifications up on your account.

Prerequisites

  • Website with HTTPS enabled
  • File access to your website

Installation

Step 1: Create a file called load-worker.js at the top level of your website with the following code:

importScripts('https://d1vjq17neg4i9o.cloudfront.net/everlytic-push-sw-0.0.1.min.js');

It is crucial that this file lives in the root of your website and not in a sub folder. To ensure that you’ve added the file correctly, you should be able to go to that file via the URL, e.g.: https://yoursite.com/load-worker.js.

Step 2: Add the following code to the <head> of your website.

<head>
    <script type="text/javascript" 
src="https://d1vjq17neg4i9o.cloudfront.net/everlytic-push-sdk-0.0.1.min.js" 
async=""></script>
    <script>
    window.addEventListener('load', function() {
        let SDK = window.EverlyticPushSDK;
        SDK.init({
            hash:"YOUR_HASH_HERE",
            autoSubscribe: true
        });
    });
    </script>
</head>

The options object that you need to provide to the init has the following fields:

[table id=7 /]

Getting a Hash from Our System

For push notifications to work, our system needs a special list to send push notifications to. We recommend using a newly created list for this, but you can also use one of the lists you have already set up.

To create one of these lists:

  1. Go to: Push Notifications (the bell and tick icon in the left-hand navigation on the system dashboard) > Push Projects. If your list is already set up here, you can jump to point 3 in this list.
  2. Click on the orange Add Push Notification Project button in the top-right of the screen. This will bring up a modal. Set the Project Type to Web Push, select your list and save.
  3. Your list should appear in the Linked List To the right of this, click the SDK Configuration link. This will bring up a modal with the hash that you need to initialise the SDK.

General SDK Usage

There are four main methods that you can call on our system’s SDK. They all return a promise that contains a result:

  1. Standard Subscription

[table id=8 /]

Here’s an example:

//... This code comes after the SDK init method
  SDK.subscribe({
      'email' : '[email protected]'
  }).then(function(result) {
      console.log(result) // Do something with the result.
  }).catch(function(error){
      console.error(error); // Something went wrong.      
  });

Typically, the email address you supply would come from your website’s logged-in user. If you don’t have access to the user’s email address, we suggest you use the subscribeAnonymous or subscribeWithAskEmailPrompt methods below.

2. Anonymous Subscription

[table id=9 /]

Here’s an example:

//... This code comes after the SDK init method that did not supply the autoSubscribe option
  SDK.subscribeAnonymous().then(function(result) {
      console.log(result) // Do something with the result.
  }).catch(function(error){
      console.error(error); // Something went wrong.      
  });

3. Prompt for Email Subscription

[table id=10 /]

Here’s an example:

//... This code comes after the SDK init method that did not supply the autoSubscribe option
  SDK.subscribeWithAskEmailPrompt().then(function(result) {
      console.log(result) // Do something with the result.
  }).catch(function(){
      console.error('Something bad happened');      
  });

This method takes an optional options object, and you can provide a force flag to ignore that the contact has already subscribed, asking for their permission again. For example:

//... This code comes after the SDK init method that did not supply the autoSubscribe option
  SDK.subscribeWithAskEmailPrompt({force:true}) 
  //... Rest of the code

4. Unsubscribe Request

[table id=11 /]

Here’s an example:

  //... This code comes after the SDK init method
  SDK.unsubscribe().then(function(result) {
      console.log(result); // Do something with the result.
  }).catch(function(error) {
      console.error(error); // Something went wrong.      
  });

Sample App

You can look at our Sample App that implements the SDK and the above methods. Just be sure to replace the hash with the one you get from our system.

Error Codes

At some point, you might get an error response with certain codes. Here are some common codes and what they mean:

[table id=12 /][/vc_column_text][/vc_column][/vc_row]