Pushpad

This guide walks you through the entire process of configuring and using Pushpad with Novu, from getting your credentials to sending your first notification.

Pushpad is a web push service that supports sending notifications to all major browsers via FCM, Mozilla autopush, Windows Push Notification Services, and APNS, with just one simple API.

Configure Pushpad with Novu

Before you can send notifications, you need to connect your Pushpad project to Novu by getting your credentials and adding them to your integration settings.

Step 1: Get your Pushpad credentials

To configure the Pushpad integration, you need:

• An active Pushpad account
• A Pushpad auth token (found in the account settings)
• Your Pushpad project ID (found in the project settings)

1. Log in to your Pushpad dashboard.
2. Click New project to create a project.
3. Click Settings on the project page and record the Project ID. You need it to connect to Novu.
4. Navigate to the access token page.
5. Click Add access token.
6. Fill in the required fields to create a new access token, or use your existing token if you already have one.
7. Copy the generated token. You need it to connect to Novu.

Step 2: Connect Pushpad to Novu

Add these credentials to your Pushpad integration in the Novu dashboard.

1. Log in to the Novu dashboard.
2. On the Novu dashboard, navigate to the Integration Store.
3. Click Connect provider.
4. Click the Push tab.
5. Select Pushpad.
6. In the Pushpad integration form, paste your access token and project ID from Step 1 into the corresponding fields.
7. Click Create Integration.

Using Pushpad with Novu

Once your integration is configured, in other to send push notification using the PushPad provider, you must do the following:

Step 1: Add subscriber device token

After setting up the Pushpad SDK on your website, you must assign a user ID (uid) to your users' push subscriptions.

This uid is the identifier Novu uses to target a specific browser. For example, if you use pushpad('uid', 'user123'), then user123 is the ID you must register in Novu.

You can do this by making an API call to update the subscriber's credentials.

import { Novu } from '@novu/api';
import { ChatOrPushProviderEnum } from "@novu/api/models/components";
 
const novu = new Novu({
  secretKey: "<NOVU_SECRET_KEY>",
  // Required if using EU region
  // serverURL: "https://eu.api.novu.co",
});
 
await novu.subscribers.credentials.update(
  {
    providerId: ChatOrPushProviderEnum.PushPad,
    // Use integrationIdentifier to store device tokens for a specific integration
    integrationIdentifier: "pushpad-MnGLxp8uy",
    credentials: {
      deviceTokens: ["token1", "token2", "token3"],
    },
  },
  "subscriberId"
);

Step 2: Send a notification

Now you're ready to send a push notification. Create a workflow with a Push step and then trigger it. Novu sends the notification to the uids associated with the subscriber.

The example below demonstrates a simple trigger using Novu’s SDK.

import { Novu } from '@novu/api';
 
const novu = new Novu({
  secretKey: "<NOVU_SECRET_KEY>",
  // Required if using EU region
  // serverURL: "https://eu.api.novu.co",
});
 
await novu.trigger({
  workflowId: "workflowId",
  to: {
    subscriberId: "subscriberId",
  },
  payload: {},
});