One iframe with src pointing at /embed/<key> installs the widget — there is no SDK or script tag
Installation is a single self-contained iframe: the embed route at /embed/<key> runs the whole widget inside your page, so there is no JavaScript SDK to load, version, or keep updated, and nothing to re-deploy when WebOptiva changes.
1. Drop in the snippet#
Add an iframe whose src is https://app.weboptiva.com/embed/<publishableKey> (locally this is http://localhost:3000/embed/<publishableKey>). Give it a width and height that fit your layout — the widget is responsible for everything inside the frame, including the URL form, the result, and the lead form. If your site has a Content-Security-Policy that restricts frames, the embed host must be permitted in your frame-src rules, as with any embedded iframe.
2. What the frame loads on its own#
On mount the page calls GET /v1/embed/config?publishableKey=..., which returns the public view of the config: { id, name, theme: { mode, primaryColor, logoUrl }, copy: { headline, subheadline }, reportDepth, language }. That is how the widget knows your colors, logo, wording, depth, and locale before anyone types a URL. A missing key yields 400 publishableKey is required.; an unknown, rotated, or deactivated key yields 401 Invalid or inactive publishable key.
3. Make sure your origin is allowlisted#
Every audit request must come from an origin listed in the config's allowedOrigins. The server takes the origin from the request's own Origin header (falling back to the Referer origin) rather than trusting the value the widget puts in the body, then matches it against the allowlist — a mismatch returns 403 This origin is not allowed for this embed. Add every domain that will host the snippet to the config before you ship it.
Expected result#
Your visitors see the widget rendered with your branding on your own page, ready to run the flow in How a run is triggered.