Skip to main content
You are here: Web SDK

Web SDK Events

Overview

Understand the process of managing events within Credenza's Web SDK to enable seamless interaction with consumer activities. Learn how event handling is crucial for responding to user actions in real-time and enhancing the overall user experience.

Manage Event Subscriptions

Subscribe to Events

To subscribe to events using sdk.on, follow these steps. Below, find examples for each specific event: ERROR, INIT, LOGIN, and LOGOUT.

  1. Import the CredenzaSDK and access the event constants by using CredenzaSDK.SDK_EVENT.

  2. Choose the event you want to subscribe to (ERROR, INIT, LOGIN, LOGOUT) by referencing CredenzaSDK.SDK_EVENT.<EVENT_NAME>.

  3. Use sdk.on(event, handler) to subscribe to the event. Replace event with the specific event constant and handler with your custom function.

Here is an example of how to subscribe to an event:

typescript
const event = CredenzaSDK.SDK_EVENT.<EVENT_NAME>;
sdk.on(event, (data) => {
  console.log('EVENT_NAME event received:', data);
});

Repeat similar steps for subscribing to other events: ERROR, LOGIN, and LOGOUT.

One-time events

For one-time event handling, use sdk.once(event, handler) instead of sdk.on(event, handler). This ensures the handler is called only the first time the event occurs.

Here is an example of one-time subscription to the LOGIN event:

typescript
const event = CredenzaSDK.SDK_EVENT.<EVENT_NAME>;
sdk.once(event, (data) => {
  console.log('EVENT_NAME event received:', data);
});

Unsubscribe from Events

To unsubscribe from events in Credenza's Web SDK, you utilize the unsubscribe function. This function stops the SDK from listening to the specific event.

  1. Identify the event subscription you want to remove.

  2. Call the unsubscribe function with the event as an argument.

    const unsubscribe = sdk.on(CredenzaSDK.SDK_EVENT.<EVENT_NAME>, (data) => {
      console.log('Event triggered');
    });
    
    // To unsubscribe
    unsubscribe();
    

Managing event listeners is important to prevent memory leaks. Memory leaks can cause performance issues in your application.

  • Improve application performance

  • Avoid unnecessary memory usage

  • Ensure efficient resource management

  • Prevent unexpected behaviors in your app

Remove Unused Event Listeners

To optimize performance and prevent memory leaks, make sure to remove event listeners when they're no longer needed. Use the unsubscribe method to clean up your listeners efficiently.

Handle Specific Events

Manage ERROR Event

Handling the ERROR event in Credenza SDK is critical to managing failures and issues effectively.

To manage errors efficiently, capture and analyze the error data. Below are some common error scenarios and how to address them:

Use the error data to debug and improve the user experience. For instance, logging the error details can help identify the frequency and type of failures, thereby facilitating prompt fixes and improvements.

By understanding and addressing these errors, you can provide a smoother and more reliable user experience. Ensure clear and concise messages to inform users about the issues and the actions they can take.

Manage INIT Event

The INIT event is triggered during the SDK initialization phase. It marks the starting point of the SDK's operational state.

Handling INIT event data involves subscribing to the event and processing the initialization details provided. This data typically includes configuration settings and initial state information.

  1. Subscribe to the INIT event using sdk.on or sdk.once.

  2. Process the provided initialization data.

  3. Execute necessary startup actions like setting default configurations or logging initialization success.

Manage LOGIN Event

The LOGIN event signals a successful user login. Handling this event lets you perform actions based on the user's authentication status.

To handle the LOGIN event, bind an event listener using sdk.on or sdk.once. This allows you to act when a user logs in.

When the LOGIN event triggers, process the data object to gather user-specific information.

Post-login actions can enhance user engagement. Here are a few examples:

  • Display a personalized welcome message using the user's name from the login data.

  • Load user-specific content or preferences.

  • Track the login event for analytics purposes.

  • Display a dashboard with the user's account details.

Manage LOGOUT Event

Handling the LOGOUT event is critical for managing user sessions and security. Prompt and proper handling ensures users' sessions end cleanly and securely.

When managing logout data, it is important to clear any session tokens, user-specific data, and cached information. This prevents unauthorized access and protects user data.

  1. Unsubscribe from real-time updates and events.

  2. Clear session tokens.

  3. Remove user-specific cached data.

  4. Redirect users to a logout confirmation page or home page.