Portal SSO (JWT hand-off)

// npm install jsonwebtoken
const jwt = require("jsonwebtoken");
const crypto = require("node:crypto");

const JUNO_TENANT_ID = process.env.JUNO_TENANT_ID; // the JWT aud
const JUNO_PORTAL_SSO_SECRET = process.env.JUNO_PORTAL_SSO_SECRET; // keep server-side
const JUNO_PORTAL_SSO_KID = process.env.JUNO_PORTAL_SSO_KID;

function signJunoHandoffToken(user) {
  return jwt.sign(
    {
      email: user.email,
      external_id: user.id,
      name: user.displayName,
      iss: "acme-portal",
      aud: JUNO_TENANT_ID,
      jti: crypto.randomUUID(),
      // Optional: standard profile fields synced onto the learner.
      attributes: {
        firstName: user.firstName,
        lastName: user.lastName,
        jobTitle: user.jobTitle,
        department: user.department,
      },
    },
    JUNO_PORTAL_SSO_SECRET,
    { algorithm: "HS256", expiresIn: 120, keyid: JUNO_PORTAL_SSO_KID },
  );
}

# pip install pyjwt
import os, time, uuid, jwt  # PyJWT

JUNO_TENANT_ID = os.environ["JUNO_TENANT_ID"]  # the JWT aud
JUNO_PORTAL_SSO_SECRET = os.environ["JUNO_PORTAL_SSO_SECRET"]  # keep server-side
JUNO_PORTAL_SSO_KID = os.environ["JUNO_PORTAL_SSO_KID"]

def sign_juno_handoff_token(user):
    now = int(time.time())
    return jwt.encode(
        {
            "email": user["email"],
            "external_id": user["id"],
            "name": user.get("display_name"),
            "iss": "acme-portal",
            "aud": JUNO_TENANT_ID,
            "jti": str(uuid.uuid4()),
            "iat": now,
            "exp": now + 120,
            # Optional: standard profile fields synced onto the learner.
            "attributes": {
                "firstName": user.get("first_name"),
                "lastName": user.get("last_name"),
                "jobTitle": user.get("job_title"),
                "department": user.get("department"),
            },
        },
        JUNO_PORTAL_SSO_SECRET,
        algorithm="HS256",
        headers={"kid": JUNO_PORTAL_SSO_KID},
    )

<?php
// composer require firebase/php-jwt
use Firebase\JWT\JWT;

function sign_juno_handoff_token(array $user): string {
    $now = time();
    $payload = [
        "email" => $user["email"],
        "external_id" => $user["id"],
        "name" => $user["displayName"] ?? null,
        "iss" => "acme-portal",
        "aud" => getenv("JUNO_TENANT_ID"),
        "jti" => bin2hex(random_bytes(16)),
        "iat" => $now,
        "exp" => $now + 120,
        // Optional: standard profile fields synced onto the learner.
        "attributes" => [
            "firstName" => $user["firstName"] ?? null,
            "lastName" => $user["lastName"] ?? null,
            "jobTitle" => $user["jobTitle"] ?? null,
            "department" => $user["department"] ?? null,
        ],
    ];
    return JWT::encode(
        $payload,
        getenv("JUNO_PORTAL_SSO_SECRET"),
        "HS256",
        getenv("JUNO_PORTAL_SSO_KID"),
    );
}

import { useRef } from "react";

const JUNO_SSO_URL = "https://api.the-juno.com/api/v1/sso/portal";

// Embeds Juno in an iframe. Clicking the button fetches a freshly-signed token
// from YOUR backend and posts it into the iframe. For a new tab instead, set
// target="_blank" and drop the <iframe>.
export function JunoEmbed({ junoRedirectUrl = "/career" }) {
  const formRef = useRef(null);
  const jwtRef = useRef(null);

  async function openJuno() {
    const { jwt } = await fetch("/api/juno-sso-token").then((r) => r.json());
    jwtRef.current.value = jwt; // token comes from your server, never the browser
    formRef.current.submit();
  }

  return (
    <>
      <button onClick={openJuno}>Open Juno</button>
      <iframe name="juno-frame" title="Juno" style={{ width: "100%", height: 800, border: 0 }} />
      <form ref={formRef} method="POST" action={JUNO_SSO_URL} target="juno-frame" hidden>
        <input ref={jwtRef} type="hidden" name="jwt" />
        <input type="hidden" name="junoRedirectUrl" value={junoRedirectUrl} />
      </form>
    </>
  );
}

const JUNO_SSO_URL = "https://api.the-juno.com/api/v1/sso/portal";

// Fetch a freshly-signed token from YOUR backend, then POST it to Juno.
// target: "_blank" opens a new tab; pass an <iframe name> to embed instead.
async function junoHandoff({ target = "_blank", junoRedirectUrl = "/career" } = {}) {
  const { jwt } = await fetch("/api/juno-sso-token").then((r) => r.json());

  const form = document.createElement("form");
  form.method = "POST";
  form.action = JUNO_SSO_URL;
  form.target = target;
  form.style.display = "none";

  const add = (name, value) => {
    const input = document.createElement("input");
    input.type = "hidden";
    input.name = name;
    input.value = value;
    form.appendChild(input);
  };
  add("jwt", jwt);
  add("junoRedirectUrl", junoRedirectUrl);

  document.body.appendChild(form);
  form.submit();
  form.remove();
}

// New tab:  junoHandoff();
// Embed:    add <iframe name="juno-frame"></iframe>, then junoHandoff({ target: "juno-frame" });

<!--
  <%= %> is server-side template interpolation (EJS/ERB, or {{ }} in Blade/Jinja):
  your backend renders the signed token into the value before sending the page.
  For an iframe embed, add target="juno-frame" + an <iframe name="juno-frame">.
-->
<form id="juno-sso" method="POST" action="https://api.the-juno.com/api/v1/sso/portal">
  <input type="hidden" name="jwt" value="<%= signJunoHandoffToken(user) %>" />
  <input type="hidden" name="junoRedirectUrl" value="/career" />
</form>
<script>document.getElementById("juno-sso").submit();</script>