Skip to main content

Initialisation sequence

When sdk.js executes it:
  1. Creates the SDK instance and assigns it to window.CashbackHive. If an instance already exists (the script was loaded twice), the second load does nothing.
  2. Reads data-* attributes from its own <script> tag. If data-key is present it calls init() immediately — this is auto-initialisation. If data-key is absent, nothing happens until you call CashbackHive.init() yourself.
  3. During init() it sends an sdk_loaded analytics beacon, and if a member token is already in localStorage from a previous visit it fetches the member in the background.
  4. Resolves the ready promise, then dispatches cbh:ready on window and calls window.onCashbackHiveReady if you defined one.
init() only runs once. Calling it a second time is ignored (and logged in debug mode).

Knowing when the SDK is ready

You must not call SDK methods before initialisation. Methods throw [CashbackHive] call init({ key }) first, or set data-key on the script tag if you do. Pick whichever readiness signal fits your code. A CustomEvent on window. The SDK is on event.detail.sdk.
Events only reach listeners that are registered before the event fires. If your listener might attach late, combine it with the initialized check below.

initialized property

A synchronous boolean on the instance. Use it to handle the “already ready” case:
This pattern is what you want in components that mount after page load, such as a route that’s navigated to client-side.

ready promise

CashbackHive.ready is a promise that resolves after init() completes. It’s convenient in async code, but it only exists once sdk.js has executed, so guard against the script not having loaded yet:

onCashbackHiveReady callback

Define a global function before the script loads and the SDK will call it with the instance. Useful in environments where you can’t add event listeners easily (for example some tag managers).

Script loading and async

Always load sdk.js with async (or your framework’s equivalent, such as Next.js’s strategy="afterInteractive"). The SDK doesn’t block rendering and has no dependency on DOM content being parsed. Because the script is async, its execution order relative to your own scripts is not guaranteed — which is exactly why you should use cbh:ready rather than assuming window.CashbackHive exists.

Single-page applications

Load the SDK once, at the application root (root layout, index.html, _app), not inside individual routes or components. Client-side navigation doesn’t reload the page, so the SDK stays initialised and cbh:ready doesn’t fire again. Components that mount later should use the initialized check shown above.

Caching

sdk.js is served with Cache-Control: public, max-age=300, stale-while-revalidate=86400. Browsers cache it for five minutes and may serve a stale copy for up to a day while revalidating in the background, so SDK updates roll out to visitors within minutes without any change on your side.