Pushpad Push Integration with Novu

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)

Open your Pushpad dashboard and sign in.

Create a project

Record the Project ID

Click Settings on the project page and record the Project ID. You need it to connect to Novu.

Open access tokens

Navigate to the access token page.

Add access token

Generate a token in Pushpad and paste it into the integration form.

Create the token

Fill in the required fields to create a new access token, or use your existing token if you already have one.

Copy the token

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.

Open the Novu Dashboard.

Open Integration Store

On the Novu dashboard, navigate to the Integration Store.

Connect a provider

In the Integration Store, click Connect provider to begin setup.

Select Push tab

Select Pushpad

In the Push tab, choose Pushpad from the provider list.

Paste credentials

In the Pushpad integration form, paste your access token and project ID from Step 1 into the corresponding fields.

Create the integration

Review your credentials, then click Create Integration to save.

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,
    integrationIdentifier: "pushpad-MnGLxp8uy",
    credentials: { deviceTokens: ["token1", "token2", "token3"] },
  },
  "subscriberId"
);

import os
import novu_py
from novu_py import Novu

with Novu(secret_key=os.getenv("NOVU_SECRET_KEY", "")) as novu:
    novu.subscribers.credentials.update(
        subscriber_id="subscriberId",
        update_subscriber_channel_request_dto={
            "provider_id": novu_py.ChatOrPushProviderEnum.PUSHPAD,
            "credentials": {"deviceTokens": ["token1", "token2", "token3"]},
            "integration_identifier": "pushpad-MnGLxp8uy",
        },
    )

import (
    "context"
    "os"

    novugo "github.com/novuhq/novu-go"
    "github.com/novuhq/novu-go/models/components"
)

s := novugo.New(novugo.WithSecurity(os.Getenv("NOVU_SECRET_KEY")))

res, err := s.Subscribers.Credentials.Update(context.Background(), "subscriberId", components.UpdateSubscriberChannelRequestDto{
    ProviderID: components.ChatOrPushProviderEnumPushPad,
    IntegrationIdentifier: novugo.String("pushpad-MnGLxp8uy"),
    Credentials: components.ChannelCredentials{
        DeviceTokens: []string{"token1", "token2", "token3"},
    },
}, nil)

use novu;
use novu\Models\Components;

$sdk = novu\Novu::builder()->setSecurity('<NOVU_SECRET_KEY>')->build();

$sdk->subscribersCredentials->update(
    subscriberId: 'subscriberId',
    updateSubscriberChannelRequestDto: new Components\UpdateSubscriberChannelRequestDto(
        providerId: Components\ChatOrPushProviderEnum::PushPad,
        integrationIdentifier: 'pushpad-MnGLxp8uy',
        credentials: new Components\ChannelCredentials(
            deviceTokens: ['token1', 'token2', 'token3'],
        ),
    ),
);

using Novu;
using Novu.Models.Components;
using System.Collections.Generic;

var sdk = new NovuSDK(secretKey: "<NOVU_SECRET_KEY>");

await sdk.Subscribers.Credentials.UpdateAsync(
    subscriberId: "subscriberId",
    updateSubscriberChannelRequestDto: new UpdateSubscriberChannelRequestDto() {
        ProviderId = ChatOrPushProviderEnum.PushPad,
        IntegrationIdentifier = "pushpad-MnGLxp8uy",
        Credentials = new ChannelCredentials() {
            DeviceTokens = new List<string> { "token1", "token2", "token3" },
        },
    });

import co.novu.Novu;
import co.novu.models.components.*;
import java.util.List;

Novu novu = Novu.builder().secretKey("<NOVU_SECRET_KEY>").build();

novu.subscribers().credentials().update()
    .subscriberId("subscriberId")
    .body(UpdateSubscriberChannelRequestDto.builder()
        .providerId(ChatOrPushProviderEnum.PUSHPAD)
        .integrationIdentifier("pushpad-MnGLxp8uy")
        .credentials(ChannelCredentials.builder()
            .deviceTokens(List.of("token1", "token2", "token3"))
            .build())
        .build())
    .call();

curl -L -X PUT 'https://api.novu.co/v1/subscribers/<SUBSCRIBER_ID>/credentials' \
-H 'Content-Type: application/json' \
-H 'Accept: application/json' \
-H 'Authorization: ApiKey <NOVU_SECRET_KEY>' \
-d '{
  "providerId": "pushpad",
  "credentials": {
    "deviceTokens": [
      "token1",
      "token2",
      "token3"
    ]
  },
  "integrationIdentifier": "pushpad-MnGLxp8uy"
}'

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: {},
});

import os
import novu_py
from novu_py import Novu

with Novu(secret_key=os.getenv("NOVU_SECRET_KEY", "")) as novu:
    novu.trigger(trigger_event_request_dto=novu_py.TriggerEventRequestDto(
        workflow_id="workflowId",
        to={"subscriber_id": "subscriberId"},
        payload={},
    ))

import (
    "context"
    "os"

    novugo "github.com/novuhq/novu-go"
    "github.com/novuhq/novu-go/models/components"
)

s := novugo.New(novugo.WithSecurity(os.Getenv("NOVU_SECRET_KEY")))

res, err := s.Trigger(context.Background(), components.TriggerEventRequestDto{
    WorkflowID: "workflowId",
    To: components.CreateToSubscriberPayloadDto(components.SubscriberPayloadDto{
        SubscriberID: "subscriberId",
    }),
    Payload: map[string]any{},
}, nil)

use novu;
use novu\Models\Components;

$sdk = novu\Novu::builder()->setSecurity('<NOVU_SECRET_KEY>')->build();

$sdk->trigger(
    triggerEventRequestDto: new Components\TriggerEventRequestDto(
        workflowId: 'workflowId',
        to: new Components\SubscriberPayloadDto(subscriberId: 'subscriberId'),
        payload: [],
    ),
);

using Novu;
using Novu.Models.Components;

var sdk = new NovuSDK(secretKey: "<NOVU_SECRET_KEY>");

await sdk.TriggerAsync(triggerEventRequestDto: new TriggerEventRequestDto() {
    WorkflowId = "workflowId",
    To = To.CreateSubscriberPayloadDto(new SubscriberPayloadDto() { SubscriberId = "subscriberId" }),
});

import co.novu.Novu;
import co.novu.models.components.*;

Novu novu = Novu.builder().secretKey("<NOVU_SECRET_KEY>").build();

novu.trigger()
    .body(TriggerEventRequestDto.builder()
        .workflowId("workflowId")
        .to(To2.of(SubscriberPayloadDto.builder().subscriberId("subscriberId").build()))
        .build())
    .call();

curl --location 'https://api.novu.co/v1/events/trigger' \
--header 'Content-Type: application/json' \
--header 'Authorization: ApiKey <NOVU_SECRET_KEY>' \
-d '{
    "name": "workflowId",
    "to": [
        "subscriberId"
    ],
    "payload": {}
}'

​Configure Pushpad with Novu

​Step 1: Get your Pushpad credentials

​Step 2: Connect Pushpad to Novu

​Using Pushpad with Novu

​Step 1: Add subscriber device token

​Step 2: Send a notification