Installation
Install @unet/id-web, what the browser needs, bundler notes, and the content security policy for an app that signs in with UNET.
npm install @unet/id-webpnpm add @unet/id-webyarn add @unet/id-webThe package is an ES module with its own type declarations. There is no CommonJS build and no global script: use it through a bundler (Vite, webpack, esbuild, Next.js, Parcel) or an <script type="module"> import map.
import { UnetId } from "@unet/id-web";
const unet = new UnetId({
clientId: "unet_xxx",
redirectUri: `${location.origin}/auth/callback`,
});What the browser needs
| Feature | Needed for | Notes |
|---|---|---|
fetch, URL, URLSearchParams | everything | any browser from the last years |
Web Crypto (crypto.subtle) | sign-in (PKCE) | only on https:// pages and on localhost; elsewhere signIn() cannot work |
AbortSignal.timeout() | request timeouts | Chrome 103, Safari 16, Firefox 100 |
Web Locks (navigator.locks) | several tabs refreshing the same session | optional; without it two tabs may refresh at once |
sessionStorage / localStorage | keeping the session | optional; without them the session lives in memory |
The two server-side checks, verifyAccessToken and verifyIdToken, need fetch, and verifyIdToken needs Web Crypto too: Node 19 or newer, Deno, Bun, or Cloudflare Workers. On Node 18, start with --experimental-global-webcrypto.
Register your app first
The SDK talks to UNET on behalf of an app, so it needs an App ID. In the console, choose Apps, New app, Single-page site or mobile/desktop app. This is a public app: it has no secret, and PKCE protects the sign-in. Add every address your sign-in page will run on as a return URL, for example http://localhost:5173/auth/callback for development and https://app.example/auth/callback for production.
Which server it talks to
By default the SDK uses the production server, https://api.unet.ovh/oidc. A test server exists too; set issuer to use it:
import { UnetId } from "@unet/id-web";
const unet = new UnetId({
clientId: "unet_xxx",
redirectUri: `${location.origin}/auth/callback`,
issuer: "https://test-api.unet.ovh/oidc",
});The issuer has to be an https address (plain http is accepted only for localhost, for development).
Content security policy
If your site sends a Content-Security-Policy, allow the SDK to reach the API:
Content-Security-Policy: connect-src 'self' https://api.unet.ovhSign-in itself is a full-page redirect to UNET and back, so it needs no frame-src or form-action rule. If you show avatars from UNET, add https://api.unet.ovh to img-src. If you play videos through unet.api.media(), add blob: to media-src.
TypeScript
Types are included; there is nothing to install from @types. Every response is typed, but note that types are not checked at run time: a field marked optional is optional because older servers may leave it out.