OAuth 2.0 · OpenID Connect

Ajoute « Se connecter avec Ismilink » à ton site.

Tes utilisateurs se connectent avec leur compte Ismilink et tu récupères leur profil en toute sécurité. Le flux suit les standards : n'importe quelle bibliothèque OAuth ou OpenID Connect fonctionne.

Le principe

Ismilink utilise le flux « Authorization Code », recommandé pour les sites web et les applications mobiles.

  1. Déclare ton application
    Dans ton espace Ismilink, onglet Développeurs : nom, logo et adresses de retour autorisées. Tu obtiens un Client ID et un Client secret.
  2. Redirige vers Ismilink
    Ton bouton envoie l'utilisateur sur /oauth/authorize. Il se connecte et accepte les permissions demandées.
  3. Reçois un code
    Ismilink renvoie l'utilisateur sur ton adresse de retour avec un code à usage unique valable 10 minutes.
  4. Échange-le côté serveur
    Ton serveur échange le code contre un jeton d'accès, un jeton de rafraîchissement et un id_token signé.

Points d'accès

Point d'accèsURL
Découverte OpenIDhttps://ismilink.com/.well-known/openid-configuration
Autorisationhttps://ismilink.com/oauth/authorize
Jetonshttps://ismilink.com/oauth/token
Profil utilisateurhttps://ismilink.com/oauth/userinfo
Révocationhttps://ismilink.com/oauth/revoke
Clés publiques (JWKS)https://ismilink.com/oauth/jwks

Permissions (scopes)

ScopeDonne accès à
openidUn identifiant unique pour te connecter (OpenID Connect).
profileNom, nom d'utilisateur, photo, langue et liens vers tes pages publiques.
emailL'adresse e-mail de ton compte Ismilink.
linksLes liens publics de ta page (hors liens verrouillés).
portfolioTitre, bio et ville affichés sur ton portfolio publié.

1. Rediriger l'utilisateur

Construis l'URL d'autorisation avec ton Client ID, une adresse de retour déclarée, les permissions souhaitées et une valeur state aléatoire que tu vérifieras au retour.

GET /oauth/authorize
https://ismilink.com/oauth/authorize
  ?response_type=code
  &client_id=al_xxxxxxxxxxxx
  &redirect_uri=https://ooyee.net/auth/ismilink/callback
  &scope=openid%20profile%20email
  &state=RANDOM_STATE
  &code_challenge=BASE64URL_SHA256_VERIFIER
  &code_challenge_method=S256

Si l'utilisateur accepte, il revient sur ton adresse de retour avec ?code=…&state=…. S'il refuse, tu reçois ?error=access_denied.

2. Échanger le code

Depuis ton serveur uniquement (ne mets jamais le secret dans le navigateur), échange le code contre des jetons. L'authentification client se fait en Basic ou dans le corps de la requête.

Node.js — côté serveur
const res = await fetch('https://ismilink.com/oauth/token', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    Authorization: 'Basic ' + Buffer.from(`${CLIENT_ID}:${CLIENT_SECRET}`).toString('base64'),
  },
  body: new URLSearchParams({
    grant_type: 'authorization_code',
    code,
    redirect_uri: 'https://ooyee.net/auth/ismilink/callback',
    code_verifier, // si tu as utilisé PKCE
  }),
});
const { access_token, refresh_token, id_token, expires_in } = await res.json();
PHP
$ch = curl_init('https://ismilink.com/oauth/token');
curl_setopt_array($ch, [
  CURLOPT_POST => true,
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_USERPWD => CLIENT_ID . ':' . CLIENT_SECRET,
  CURLOPT_POSTFIELDS => http_build_query([
    'grant_type' => 'authorization_code',
    'code' => $_GET['code'],
    'redirect_uri' => 'https://ooyee.net/auth/ismilink/callback',
  ]),
]);
$tokens = json_decode(curl_exec($ch), true);

3. Lire le profil

Appelle /oauth/userinfo avec l'en-tête Authorization: Bearer <access_token>. Les champs renvoyés dépendent des permissions accordées.

GET /oauth/userinfo — réponse
{
  "sub": "42",
  "name": "Sara Benali",
  "preferred_username": "sara",
  "picture": "https://ismilink.com/uploads/…",
  "profile": "https://ismilink.com/p/sara",
  "website": "https://ismilink.com/@sara",
  "locale": "fr",
  "email": "sara@example.com",
  "email_verified": false
}

Utilise le champ « sub » comme identifiant stable de l'utilisateur : il ne change jamais, même si l'utilisateur modifie son nom ou son e-mail.

PKCE (applications publiques)

Pour une application sans serveur (mobile, SPA), coche « Application publique » : aucun secret n'est utilisé, et PKCE devient obligatoire. Génère un code_verifier, envoie son empreinte SHA-256 en code_challenge, puis transmets le code_verifier lors de l'échange.

JavaScript
const verifier = base64url(crypto.getRandomValues(new Uint8Array(32)));
const digest = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(verifier));
const challenge = base64url(new Uint8Array(digest));

Rafraîchir et révoquer

Le jeton d'accès expire au bout d'une heure. Utilise le jeton de rafraîchissement pour en obtenir un nouveau : il est remplacé à chaque utilisation (rotation). Pour déconnecter un utilisateur, révoque ses jetons.

POST /oauth/token
grant_type=refresh_token&refresh_token=alrt_…
# révoquer un jeton (déconnexion)
POST /oauth/revoke   token=alat_…

Le bouton officiel

Utilise ce bouton pour que tes utilisateurs reconnaissent Ismilink au premier coup d'œil. Garde le libellé « Se connecter avec Ismilink » et une hauteur d'au moins 44 px.

HTML + CSS
<a class="ismilink-btn" href="/auth/ismilink">
  <img src="https://ismilink.com/img/logo.png" alt="" width="22" height="22">
  Se connecter avec Ismilink
</a>
<style>
.ismilink-btn{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 20px;
  border-radius:14px;background:linear-gradient(135deg,#3d5afe,#7c3aed);color:#fff;
  font:600 16px/1 system-ui,sans-serif;text-decoration:none;
  box-shadow:0 10px 30px -10px rgba(124,58,237,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.ismilink-btn:hover{filter:brightness(1.08)}
.ismilink-btn:focus-visible{outline:3px solid #6d28d9;outline-offset:2px}
</style>