Skip to main content

Option 1: Real API on localhost

The simplest setup is to add your local origin — for example http://localhost:3000 — to the property’s allowed origins in the publisher portal. The SDK then works exactly as it will in production, with real offers and real sign-in. Remember that the port is part of the origin: http://localhost:3000 and http://localhost:5173 are different origins and both need to be allowed if you use both.

Option 2: Mock mode

Mock mode replaces the network transport with an in-memory one that returns sample data. It’s useful when you’re offline, writing UI tests, or working on a page before your origin has been approved. Enable it with the data-mock attribute (its presence is enough — no value needed):
Or with manual initialisation:

What mock mode does

  • offers.list() and offers.get() return a fixed catalogue of eight sample brands (Chewy, Nike, Sephora, Expedia, Walmart, HelloFresh, Wayfair, Target) with a mix of percentage and flat cashback, pinned and unpinned, and with and without deep-link support. Search, category, limit and offset all work against this set.
  • auth.signIn() resolves after ~300 ms with a sample member (“Sandbox Member”) — no popup is opened.
  • member.activity() returns four sample transactions covering every status (pending, confirmed, paid, declined).
  • Click URLs point at https://click.invalid/…, a reserved domain that will never resolve, so you can’t accidentally generate real clicks. openOffer() still emits the click event.
  • Analytics beacons are logged in debug mode instead of being sent.
  • Responses are delayed by 80–150 ms to approximate network latency, so loading states are exercised.

What mock mode doesn’t do

  • It doesn’t validate your key or origin. A working mock integration doesn’t prove your origin is allowed — test against the real API before launch.
  • The sample data is fixed and may not match your property’s real categories or cashback rates.
Never ship data-mock to production. Make it conditional on your environment, e.g. in Next.js:

Debug logging

Add data-debug (or init({ debug: true })) to log SDK activity to the console, prefixed with [CashbackHive]:
In mock mode, debug logging also prints every analytics event that would have been sent.

Pointing at a different API

For Cashback Hive-provided staging environments, data-api (or init({ apiBase })) overrides the API base URL. You won’t normally need this.

Verifying your install

On an allowed origin, open the browser console:
And in the Network tab, look for: