Integrate Javascript SDK

📘 Upgrading major version of SDK:We have changed the web SDK authentication from workspace key-secret to public key and JWT based authentication. This is done to improve security in frontend applications.

Refer the v1 SDK documentation
For migrating to v2, follow this guide

This is the client JavaScript SDK used to integrate SuprSend features like Webpush, Preferences in JavaScript websites like React, Next.js, Angular, Vue.js etc.

NPM Link

GitHub Link

Installation

npm install @suprsend/web-sdk@latest

yarn add @suprsend/web-sdk@latest

Integration

Create Client

Create suprSendClient instance and use same instance to access all the methods of SuprSend library.

import SuprSend from '@suprsend/web-sdk';

export const suprSendClient = new SuprSend(publicApiKey: string);

Params	Description
publicApiKey*	This is public Key used to authenticate API calls to SuprSend. Get it in SuprSend dashboard ApiKeys -> Public Keys section

Authenticate User

Authenticate user so that all the actions performed after authenticating will be w.r.t that user. This is mandatory step and need to be called before using any other method. This is usually performed after successful login and on reload of page to re-authenticate user.

const authResponse = await suprSendClient.identify(
  distinctId: any,
  userToken?: string, // only needed in production environments for security
  { refreshUserToken: (oldUserToken: string, tokenPayload: Dictionary) => Promise<string> }
);

Properties	Description
distinctId*	Unique identifier to identify a user across platform.
userToken	Mandatory when enhanced security mode is on. This is ES256 JWT token generated in your server-side. Refer docs to create userToken.
refreshUserToken	This function is called by SDK internally to get new userToken before existing token is expired. The returned string is used as the new userToken.

Returns: Promise<ApiResponse>

2.1 Check if user is authenticated

This method will check if user is authenticated i.e. distinctId is attached to SuprSend instance. To check for userToken also pass checkUserToken flag true.

suprSendClient.isIdentified(checkUserToken?: boolean): boolean

Reset user

This will remove user data from SuprSend instance. This is usually called on logout action.

await suprSendClient.reset();

Returns: Promise<ApiResponse>

Response structure

Almost all the methods in this SDK return response type Promise<ApiResponse>

interface ApiResponse {
  status: 'success' | 'error';
  statusCode?: number;
  error?: { type?: string; message?: string };
  body?: any;
}

// success response
{
  status: "success",
  body?: any,
  statusCode?: number
}

// error response
{
  status: "error",
  error: {
    type: string,
    message: string
  }
}

WebPushSet up web push notifications in React, Vue, Angular, and Next.js websites with the SuprSend JavaScript SDK including service worker and VAPID config.

⌘I

Developer Resources

Updates and Versioning

Authentication

Security

SDKs and APIs

Features

Testing

Monitoring and Logging

NPM Link

GitHub Link

Installation

Integration

2.1 Check if user is authenticated

Response structure

NPM Link

GitHub Link

​Installation

​Integration

​2.1 Check if user is authenticated

​Response structure

Installation

Integration

2.1 Check if user is authenticated

Response structure