Pushpad Logo Pushpad

Pushpad Pro: Javascript SDK reference

You can use the Javascript SDK to subscribe a browser to web push notifications and manage its subscription. Before using the Javascript SDK you need to include it in your website as described in the Getting started section.

pushpad('init', projectId, options)

You must always call this function.

pushpad('init', "123");

// For Safari you may need to explicitly set the hostname (see options)

// other commands...

You can use it to set your projectId globally. Otherwise you must pass it as an option to the other functions.

// useful if you have multiple projects on the same page

pushpad('subscribe', function () {}, { projectId: "123" });
pushpad('subscribe', function () {}, { projectId: "456" });

The same domain can have multiple projects associated to it (think to a project as a "mailing list"). This is also useful to manage multiple environments such as development and production.

pushpad('init', isProductionEnv ? productionProjectId : developmentProjectId);

pushpad('uid', uid, uidSignature)

Associate a user ID to the subscription. It allows to target specific users with web push notifications.

pushpad('uid', '33', '4b9503324d1c97ecfc551dbb377452c85da8ebb9');

If the browser is already subscribed to push notifications, then the uid is updated immediately. Otherwise the uid will be associated when a subscription is created:

pushpad('uid', '33', '4b9503324d1c97ecfc551dbb377452c85da8ebb9');

// is the same as

pushpad('subscribe', null, { uid: '33', uidSignature: '4b9503324d1c97ecfc551dbb377452c85da8ebb9' });

See subscribe for a description of the params.

pushpad('status', callback, options)

It lets you know whether the browser is subscribed to your web push notifications and retrieves data about the subscription.

pushpad('status', function (isSubscribed, tags, uid) { console.log(isSubscribed, tags, uid); });

Note that you can also use this function to detect browser support since the callback is only executed if the browser supports push notifications (however you should prefer the use of the unsupported function whenever possible).

pushpad('subscribe', callback, options)

Subscribe the browser to web push notifications or add data to the existing subscription.

pushpad('subscribe', function () { console.log('Subscribed!'); });

// or

pushpad('subscribe', function (isSubscribed) { 
  if (isSubscribed) {
  } else {
    console.log('Notifications blocked by the user.');

// create or update the subscription 
pushpad('subscribe', function () {}, { 
  tags: ['t1', 't2'], // add tags 't1' and 't2'
  uid: '33', // keep track of the current user ID
  uidSignature: '4b9503324d1c97ecfc551dbb377452c85da8ebb9'

// add some tags to the existing subscription (or create it)
pushpad('subscribe', function () {}, { tags: ['t1', 't2'] });

If this is the first time you call this function for a user, the browser will show him a prompt asking whether he wants to receive push notifications from your website.

You can call subscribe as many times as you want, for example on page load, to make sure that the current user gets subscribed to push notifications if he has authorized them for your website in his browser preferences.

pushpad('unsubscribe', callback, options)

Unsubscribe the browser from web push notifications or remove data from the subscription.

// remove the subscription to push notifications
pushpad('unsubscribe', function () { console.log('Unsubscribed!'); });

// remove only tag 't1' from the subscription
pushpad('unsubscribe', function () {}, { tags: ['t1'] });

// remove only the user ID from the the subscription
pushpad('unsubscribe', function () {}, { uid: true });

pushpad('unsupported', callback)

It provides a fallback for browsers that doesn't support web push notifications.

pushpad('unsupported', function () { console.log('Browser unsupported.'); });

Notice that when a browser is unsupported the calls to all the other functions are ignored and do not throw any error.