Embedding the new Port Congestion dashboard into your own web app is as simple as including one script and one tag — works in plain HTML and with every major framework.

The element renders the dashboard in a sandboxed iframe. Access is controlled by a short-lived token you mint from your Portcast API key.


Step 1 — Include the script

Add this once, anywhere on your page (e.g. in <head>):

<script src="<https://cdn.portcast.io/embed/portcast-eta-embed.js>"></script>

Served from our CDN with CORS enabled, so a plain <script> tag works from any domain.

Step 2 — Embed it wherever you want

Drop this tag anywhere the dashboard should appear:

<portcast-eta-embed
  src="<https://app.portcast.io/embed/port_congestion>"
  token="YOUR_TOKEN"
  org-id="YOUR_ORG_ID"
  style="height: 100%; width: 600px;"
></portcast-eta-embed>

That's it — the dashboard renders inline. Size it with your own style / CSS class (defaults to full width, 600px tall). You also need a token (Step 3) and your org-id — your Portcast organisation ID, which must match the org the token was minted for (Portcast provides it).

Step 3 — Generate the token (server-side)

The token is a short-lived credential you mint from your Portcast API key on your server, then pass into the tag:

curl -X POST "<https://api.portcast.io/api/v2/org/self-token>" \
  -H "x-api-key: YOUR_PORTCAST_API_KEY" \
  -H "content-type: application/json" \
  -d '{"expiry_in_minutes": 240}'

# → { "token": "eyJhbGci..." }

expiry_in_minutes is optional — default 240 (4 h), min 5, max 1440.

<aside> ⚠️

Always generate tokens server-side. Never put your x-api-key in browser/client code — this would effectively expose your Portcast credentials. Only the short-lived token should ever reach the browser.

</aside>


Attributes

Attribute Required Description
src Yes The dashboard URL Portcast gives you (must be https). Determines which dashboard renders.
token Yes Your short-lived token from Step 3. Updating this attribute live reloads the embed — use it to refresh an expiring session in place.
org-id Yes Your Portcast organisation ID (Portcast provides it). Must match the org the token was minted for — if it doesn't, the embed refuses to load. The token still governs access; this is a required safety cross-check.