Web Integration
Hubble SDK is a hosted web application. You can embed it in your app either in an iframe or by opening it in a new window.
1. URL Format
The SDK runs at:
https://vouchers.myhubble.money/classic?clientId=YOUR_CLIENT_ID&clientSecret=YOUR_CLIENT_SECRET&token=YOUR_TOKENFor development, use:
https://vouchers.dev.myhubble.money/classic?clientId=YOUR_CLIENT_ID&clientSecret=YOUR_CLIENT_SECRET&token=YOUR_TOKENClient ID and Client Secret will be provided by Hubble. For more details on token and sso process in general, see the SSO Guide.
2. Opening the SDK
Option A: Embed in an iframe
<iframe src="https://vouchers.myhubble.money/classic?clientId=xxx&clientSecret=yyy&token=zzz" style="width:100%;height:100%;border:none;" allow="clipboard-write *" ... ...></iframe>Option B: Open in a new window
window.location.href = "https://vouchers.myhubble.money/classic?clientId=xxx&clientSecret=yyy&token=zzz";👉 Note: If you open in a new window, you will not receive SDK events.
3. Listening to Events
When embedded in an iframe, the SDK posts events using postMessage.
You can capture them like this:
window.addEventListener("message", function (event) { if (event.data.type === "event") { // Log events to Mixpanel, Clevertap, etc. // // Sample events: // { // "type": "event", // "event": "exited", // "properties": { // "through": "home_back_button" // } // } // // { // "type": "event", // "event": "visit_brand_l2", // "properties": { // "productId": "01GMAW9HTBB70C8WQQTHW6R8SR", // "brandName": "Myntra" // } // } }});For the complete list of events and properties, see the SDK Events Reference.
4. Deeplinks (Optional)
You can direct users to a specific page in the SDK by adding a page parameter (with optional sub-parameters) to the URL.
| Page | Additional Params | Example |
|---|---|---|
brand | brandId | ...?page=brand&brandId=01GMAW9HTBB70C8WQQTHW6R8SR |
support | — | ...?page=support |
transactions | — | ...?page=transactions |
search | searchCategory | ...?page=search&searchCategory=electronics |