Frontend Integration

Scrimmage Rewards can be integrated into your web application in two primary ways:

• Using the Scrimmage Rewards Widget
• Using the Scrimmage Rewards API

Scrimmage Rewards Widget

The Scrimmage Rewards Widget is an HTML single-page application that can be embedded into your application. Scrimmage handles the hosting, certificates, and security for the widget. You can customize the widget to align with your application's aesthetics.

Integration through the widget is the simplest way to start using Scrimmage Rewards.

For detailed integration instructions based on your platform, refer to the following links:

• Flying Widget
• Web
• Android
• iOS
• React Native
• Flutter

If your platform is not listed, please visit Other Integrations for guidance on how to incorporate Scrimmage Rewards into your application.

Scrimmage Rewards API

The Scrimmage Rewards API is a RESTful API that offers a flexible approach for integrating Scrimmage Rewards into your application, compared to the widget. This method requires more effort to set up and maintain. You will need to update the API client whenever new versions are released. However, it provides greater control over the integration and allows for extensive customization to meet your specific needs.

API Endpoints

For detailed information on the available endpoints, refer to the Player API section of the API Reference.

Commonly used endpoints include:

• Player Info - Retrieves player's information, including balance, level, properties, and more.
• Player Quests - Retrieves a list of quests available to the player.
• Levels - Retrieves a list of levels in the loyalty program.

Real-Time Updates

For real-time updates on player status, you can use a WebSocket connection. We implement this using the socket.io library.

Here is the WebSocket URL:

wss://<your-api-url>.apps.scrimmage.co/nbc/events/socket.io

To authenticate the WebSocket connection, send the Authorization header with the value Bearer <user access token>.

UI Toolkit

For seamless integration and a consistent look and feel, we recommend using the @scrimmage/ui-toolkit. The UI Toolkit provides a set of functions to help you integrate the Scrimmage Rewards widget or API into your application.