UPCS Embedded Map Not Showing

When the embedded UPCS map is blank or never appears, the cause is almost always one of four things: the session, the allowed origin, the script, or the container on the page.

Symptom

An empty space, a spinner that never ends, or an error in the browser console where the map should be.

Likely causes

• The server could not create a session, or the session expired.
• The site's origin is not registered under Allowed origins.
• The embed script was blocked or not loaded before UPCS.mount ran.
• The target element does not exist, or has no height.

Fix it step by step

1. Open the browser developer console and look at the Console and Network tabs for red entries.
2. Check the session request. If it returns 401, see session_expired or invalid or inactive key. If it returns 403, see origin_not_allowed.
3. Confirm the page loads https://api.upcs.io/api/embed/upcs-embed.js and that it is not blocked by a content security policy, an ad blocker or a mixed-content (http) warning. Your page must be served over https.
4. Confirm UPCS.mount runs after the script and after the element exists, and that the selector matches it.
5. Give the container a visible size by passing height, or setting a CSS height on the element.
6. Use onError in the options to log what the map reports.
7. Disable page caching for the page and test in a private window.

Confirm it is fixed

The map appears, you can pan and zoom, and tapping a point calls onSelect with a code, latitude and longitude.

When to contact support

If the session is created, the origin is registered and the script loads, but the map is still blank, contact support with the page address, the browser and the console error text.