Javascript SDK

📘

Upgrading major version of SDK

Please refer migration guide if you are migrating the major version of SDK.

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: https://www.npmjs.com/package/@suprsend/web-sdk

Github link: https://github.com/suprsend/suprsend-web-sdk

Installation

npm install @suprsend/web-sdk@latest

yarn add @suprsend/web-sdk@beta

Integration

1. 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);

2. 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> }
);

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

3. 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
  }
}