Iframe Embedding

Each signed link endpoint returns a URL that you embed as an <iframe> in your application. This page covers how signed URLs work, security configuration, responsive layout, and handling URL expiry.

How signed URLs work

Signed URLs are opaque, time-limited tokens generated by RecruitiFi. Each URL:

• Authenticates the session without exposing your API token to the browser
• Expires after a set period (indicated by the expiresAt field in the response)
• Is scoped to a specific user, customer, and resource

Your server fetches the signed URL via the API, then passes it to the client for rendering in an iframe. The end user never sees or handles your API credentials.

Basic iframe example

<iframe
  src="https://app.recruitifi.com/embed/settings?token=eyJhbGciOi..."
  width="100%"
  height="600"
  frameborder="0"
  allow="clipboard-write"
  sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
></iframe>

Security attributes

Configure the sandbox attribute to restrict iframe capabilities to only what’s needed.

Attribute	Purpose
allow-scripts	Required. Enables JavaScript execution within the iframe.
allow-same-origin	Required. Allows the iframe content to access its own origin for API calls and cookies.
allow-forms	Required. Permits form submissions within the iframe (e.g., saving settings, submitting actions).
allow-popups	Optional. Allows the iframe to open new windows if needed (e.g., file downloads).

The allow attribute controls browser feature permissions:

Value	Purpose
clipboard-write	Allows copy-to-clipboard functionality within the iframe.

Note

Only grant the minimum permissions your use case requires. The attributes listed above cover the typical RecruitiFi integration. Remove allow-popups if your use case doesn’t need it.

Responsive sizing

Use CSS to make the iframe adapt to its container:

<div style="position: relative; width: 100%; padding-top: 75%; overflow: hidden;">
  <iframe
    src="https://app.recruitifi.com/embed/settings?token=eyJhbGciOi..."
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;"
    allow="clipboard-write"
    sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
  ></iframe>
</div>

Alternatively, set a fixed height with full width:

iframe {
  width: 100%;
  height: 700px;
  border: none;
}

Adjust the height based on which RecruitiFi view you’re embedding. Settings and task views typically need 600-800px, while job and application views may benefit from more vertical space.

Handling URL expiry

Caution

Signed URLs expire. Always check the expiresAt timestamp before rendering an iframe. If the URL has expired, fetch a new one from the API before setting the iframe src.

A practical approach:

1. Fetch the signed URL from the API on your server.
2. Pass the URL and expiresAt to your client.
3. Before rendering, compare expiresAt against the current time. If expired (or expiring within the next 60 seconds), request a fresh URL.
4. On navigation or tab focus, re-check expiry and refresh if needed.

function isExpired(expiresAt) {
  const buffer = 60 * 1000; // 60 second buffer
  return new Date(expiresAt).getTime() - buffer < Date.now();
}

Tip

Cache signed URLs on your server for their validity period to avoid unnecessary API calls. Use the expiresAt field as your cache TTL. Fetch a new URL only when the cached one is expired or about to expire.