Create the client

// main.tsx — once, around your app.
import { SpeechineerProvider } from "@speechineer/react";

<SpeechineerProvider
  apiKey={import.meta.env.VITE_SPEECHINEER_API_KEY}             // the Unsigned API key
  account={{ key: currentUser.id, pseudonym: currentUser.name }} // who this end user is
>
  <App />
</SpeechineerProvider>

// app.config.ts — once.
import { provideSpeechineer } from "@speechineer/angular";

export const appConfig: ApplicationConfig = {
  providers: [
    provideSpeechineer({
      apiKey: environment.speechineerApiKey,                         // the Unsigned API key
      account: { key: currentUser.id, pseudonym: currentUser.name }, // who this end user is
    }),
  ],
};

// speechineer-client.js — once, at app startup; import it wherever you open a session.
import { createClient } from "@speechineer/js";

export const speechineer = createClient({
  apiKey: "spnr_live_…",                                         // the Unsigned API key
  account: { key: currentUser.id, pseudonym: currentUser.name }, // who this end user is
});

// server/speechineer-token.ts — sits behind your own login, like any other route.
import { Router } from "express";
import { SignJWT, importPKCS8 } from "jose";
import { randomUUID } from "node:crypto";

// From the workspace: the Signed API key, the signing key's Key ID and its private half.
const API_KEY = process.env.SPEECHINEER_API_KEY!;
const KEY_ID = process.env.SPEECHINEER_SIGNING_KEY_ID!;
const privateKey = await importPKCS8(process.env.SPEECHINEER_SIGNING_KEY_PEM!, "PS256");

export const speechineerToken = Router().get("/api/speechineer/token", async (req, res) => {
  const user = req.user; // whoever your session middleware authenticated
  if (!user) return res.status(401).end();

  const token = await new SignJWT({
    api_key: API_KEY,                 // which workspace, and that it is the Signed key
    account_key: user.id,             // the account this session is for — your user id
    account_pseudonym: user.name,     // optional: the name the workspace shows for it
  })
    .setProtectedHeader({ alg: "PS256", kid: KEY_ID })
    .setAudience("speechineer")
    .setIssuedAt()
    .setExpirationTime("5m")          // short — the SDK asks for a new one at every start
    .setJti(randomUUID())             // unique per token — a token is accepted once
    .sign(privateKey);

  res.json({ token });
});

# speechineer_token.py — sits behind your own login, like any other route.
import os, time, uuid
import jwt  # PyJWT with the cryptography extra
from fastapi import APIRouter, Depends

from .auth import current_user  # your own dependency

router = APIRouter()

# From the workspace: the Signed API key, the signing key's Key ID and its private half.
API_KEY = os.environ["SPEECHINEER_API_KEY"]
KEY_ID = os.environ["SPEECHINEER_SIGNING_KEY_ID"]
PRIVATE_KEY_PEM = os.environ["SPEECHINEER_SIGNING_KEY_PEM"]


@router.get("/api/speechineer/token")
def speechineer_token(user=Depends(current_user)):
    now = int(time.time())
    token = jwt.encode(
        {
            "api_key": API_KEY,                # which workspace, and that it is the Signed key
            "account_key": user.id,            # the account this session is for — your user id
            "account_pseudonym": user.name,    # optional: the name the workspace shows for it
            "aud": "speechineer",
            "iat": now,
            "exp": now + 300,                  # short — the SDK asks for a new one at every start
            "jti": str(uuid.uuid4()),          # unique per token — a token is accepted once
        },
        PRIVATE_KEY_PEM,
        algorithm="PS256",
        headers={"kid": KEY_ID},
    )
    return {"token": token}

// main.tsx — once, around the part of your app that needs a login.
import { SpeechineerProvider } from "@speechineer/react";

// The token provider: the SDK calls it before every session start, so a fresh,
// short-lived token is always used. It runs in the browser with the user's own
// login cookie — nothing secret lives here.
async function fetchSpeechineerToken(): Promise<string> {
  const res = await fetch("/api/speechineer/token", { credentials: "include" });
  if (!res.ok) throw new Error(`Not signed in (${res.status})`);
  const { token } = (await res.json()) as { token: string };
  return token;
}

<SpeechineerProvider token={fetchSpeechineerToken}>
  <App />
</SpeechineerProvider>

// app.config.ts — once.
import { provideSpeechineer } from "@speechineer/angular";

// The token provider: the SDK calls it before every session start, so a fresh,
// short-lived token is always used. It runs in the browser with the user's own
// login cookie — nothing secret lives here.
async function fetchSpeechineerToken(): Promise<string> {
  const res = await fetch("/api/speechineer/token", { credentials: "include" });
  if (!res.ok) throw new Error(`Not signed in (${res.status})`);
  const { token } = (await res.json()) as { token: string };
  return token;
}

export const appConfig: ApplicationConfig = {
  providers: [provideSpeechineer({ token: fetchSpeechineerToken })],
};

// speechineer-client.js — once, at app startup; import it wherever you open a session.
import { createClient } from "@speechineer/js";

// The token provider: the SDK calls it before every session start, so a fresh,
// short-lived token is always used. It runs in the browser with the user's own
// login cookie — nothing secret lives here.
async function fetchSpeechineerToken() {
  const res = await fetch("/api/speechineer/token", { credentials: "include" });
  if (!res.ok) throw new Error(`Not signed in (${res.status})`);
  const { token } = await res.json();
  return token;
}

export const speechineer = createClient({ token: fetchSpeechineerToken });