Custom API Integration – Size Recommendation
This guide is for developers integrating the AI size recommendation system into custom websites, mobile apps, or headless commerce solutions.
Recommended Architecture
- Frontend opens AI UI via iframe or redirect
- User completes measurement flow
- AI returns recommended size
- Frontend applies business logic
Iframe Integration
<iframe src="https://measure.sadiq.ai/size-ui-v2" allow="camera" style="width:420px;height:620px;border:none;" ></iframe>
PostMessage Response
{
action: "closeModalAndHighlight",
recommendedSize: "M"
}
JavaScript Listener
window.addEventListener("message", function (event) {
if (!event.origin.includes("measure.sadiq.ai")) return;
if (event.data.action === "closeModalAndHighlight") {
console.log("Recommended size:", event.data.recommendedSize);
}
});
Use Cases
- Headless commerce
- Mobile apps (WebView)
- Custom React / Vue frontends