Overview
Frontend integration is what puts the Sportsbook iFrame on your page and keeps the two sides in sync — routing, theme, balance, and the events your platform has to react to.
General info
Sportsbook iFrame uses a token-based authentication protocol for authenticating users and securing interactions between the client’s platform and GR8 Tech’s services. This protocol generates encrypted security tokens that are used to verify the identity of users on the website.
The client’s platform generates a unique encrypted authentication token using the token-based authentication protocol provided by GR8 Tech.
GR8 Tech provides clients with a brand with preconfigured features and color styles, and an iframe host to use for the frontend integration.
How the integration works
Everything the iFrame exchanges with your page travels over window.postMessage. You do not work with that protocol directly: integration goes through the integration module, a small integration.js file you copy into your project.
The module wraps the protocol in on() and emit(), creates the iframe element with the attributes it needs, and handles route syncing for you. Every example in this section uses it.
The Mini iFrame widget is the one exception. The module does not mount it, so it is embedded with a plain iframe tag and its events are handled with window.addEventListener. That page documents its own setup.
Getting to a working integration
- Get it on the page — the URL and its parameters,
mount(), and a complete integration you can copy, with a diagram of the load handshake and a pre-flight checklist. - Handle the events your platform must react to — login, registration and auth failures. An unhandled
login.clickmeans a player clicks Login inside the iFrame and nothing happens. - Sync the rest — routing, theme, and balance and currency, depending on what your platform does.
Authentication itself — generating and signing the JWT — is covered in Players Authorization. Wallet endpoints are in Wallet Integration — its own top-level section, since iFrame and Sportsbook API integrations share the same wallet flow.
Where to go next
| Page | What it covers |
|---|---|
| Getting Started | The iFrame URL, mount(), a complete integration, share links, checklist |
| Integration Module | integration.js: the API, what it handles for you, what’s safe to change |
| Mini iFrame | The compact embeddable widget |
Events
Everything you subscribe to and everything you send, grouped by what you are building:
| Page | What it covers |
|---|---|
| All Events | The index — every event, its direction and exact payload |
| Navigation & Routing | Two-way route sync, driving the iFrame, openLink, the React hook |
| Theme Mode | Light and dark switching, initial theme on load |
| Balance & Currency | Balance updates, forced refresh, deposits, multi-currency |
| Session & Auth | Logout obligation, login.click, register.click, auth.fail |