Protected App — Intégration d’authentification sans SDK

La Protected App est conçue pour éliminer la complexité des intégrations SDK en séparant la couche d’authentification de votre application. Nous gérons l’authentification, vous permettant de vous concentrer sur votre fonctionnalité principale. Une fois l’utilisateur authentifié, la Protected App sert le contenu depuis votre serveur.

Fonctionnement de la Protected App

La Protected App, propulsée par Cloudflare, fonctionne globalement sur des réseaux edge, garantissant une faible latence et une haute disponibilité pour votre application.

La Protected App maintient l’état de session et les informations utilisateur. Si un utilisateur n’est pas authentifié, la Protected App le redirige vers la page de connexion. Une fois authentifié, la Protected App encapsule la requête de l’utilisateur avec les informations d’authentification et d’utilisateur, puis la transmet au serveur d’origine.

Ce processus est visualisé dans le diagramme de flux suivant :

Protéger votre serveur d’origine

Le serveur d’origine, qui peut être un appareil physique ou virtuel n’appartenant pas à la Protected App de Logto, est l’endroit où réside le contenu de votre application. À l’instar d’un serveur de Content Delivery Network (CDN), la Protected App gère les processus d’authentification et récupère le contenu depuis votre serveur d’origine. Par conséquent, si des utilisateurs accèdent directement à votre serveur d’origine, ils peuvent contourner l’authentification et votre application n’est plus protégée.

Il est donc important de sécuriser les connexions à l’origine, cela empêche les attaquants de découvrir et d’accéder à votre serveur d’origine sans authentification. Il existe plusieurs façons de le faire :

1. Validation d’en-tête HTTP
2. Validation de JSON Web Tokens (JWT)

Validation d’en-tête HTTP

Sécuriser votre serveur d’origine peut être réalisé en utilisant HTTP Basic Authentication.

Chaque requête provenant de la Protected App inclut l’en-tête suivant :

Authorization: Basic base64(appId:appSecret)

En validant cet en-tête, vous pouvez confirmer que la requête provient de la Protected App et refuser toute requête ne comportant pas cet en-tête.

Si vous utilisez Nginx ou Apache, vous pouvez consulter les guides suivants pour mettre en place l’authentification HTTP Basic sur votre serveur d’origine :

1. Nginx : Configurer l’authentification HTTP Basic
2. Apache : Authentification et Autorisation

Pour vérifier les en-têtes dans votre application, consultez l’exemple d’authentification HTTP Basic fourni par Cloudflare pour apprendre à restreindre l’accès en utilisant le schéma HTTP Basic.

Validation de JSON Web Tokens (JWT)

Une autre façon de sécuriser votre serveur d’origine est d’utiliser des JSON Web Tokens (JWT).

Chaque requête authentifiée provenant de la Protected App inclut l’en-tête suivant :

Logto-ID-Token: <JWT>

Le JWT est appelé Jeton d’identifiant (ID token) qui est signé par Logto et contient des informations utilisateur. En validant ce JWT, vous pouvez confirmer que la requête provient de la Protected App et refuser toute requête ne comportant pas cet en-tête.

Le jeton est chiffré et signé en tant que jeton JWS.

Les étapes de validation :

1. Valider un JWT
2. Valider la signature JWS
3. L’émetteur du jeton est https://<your-logto-domain>/oidc (émis par votre serveur d’authentification Logto)

const express = require('express');
const jwksClient = require('jwks-rsa');
const jwt = require('jsonwebtoken');

const ISSUER = 'https://<your-logto-domain>/oidc';
const CERTS_URL = 'https://<your-logto-domain>/oidc/jwks';

const client = jwksClient({
  jwksUri: CERTS_URL,
});

const getKey = (header, callback) => {
  client.getSigningKey(header.kid, function (err, key) {
    callback(err, key?.getPublicKey());
  });
};

const verifyToken = (req, res, next) => {
  const token = req.headers['Logto-ID-Token'];

  // Vérifiez que la requête entrante possède bien notre en-tête de jeton
  if (!token) {
    return res
      .status(403)
      .send({ status: false, message: 'en-tête Logto-ID-Token requis manquant' });
  }

  jwt.verify(token, getKey, { issuer: ISSUER }, (err, decoded) => {
    if (err) {
      return res.status(403).send({ status: false, message: 'jeton d’identifiant invalide' });
    }

    req.user = decoded;
    next();
  });
};

const app = express();

app.use(verifyToken);

app.get('/', (req, res) => {
  res.send('Bonjour le monde !');
});

app.listen(3000);

Obtenir l’état d’authentification et les informations utilisateur

Si vous avez besoin d’obtenir l’état d’authentification et les informations utilisateur pour votre application, vous pouvez également utiliser l’en-tête Logto-ID-Token.

Si vous souhaitez simplement décoder le jeton, vous pouvez utiliser le code suivant :

const express = require('express');

const decodeIdToken = (req, res, next) => {
  const token = req.headers['Logto-ID-Token'];

  if (!token) {
    return res.status(403).send({
      status: false,
      message: 'en-tête Logto-ID-Token requis manquant',
    });
  }

  const parts = token.split('.');
  if (parts.length !== 3) {
    throw new Error('Jeton d’identifiant invalide');
  }

  const payload = parts[1];
  const decodedPayload = atob(payload.replace(/-/g, '+').replace(/_/g, '/'));
  const claims = JSON.parse(decodedPayload);

  req.user = claims;
  next();
};

const app = express();

app.use(decodeIdToken);

app.get('/', (req, res) => {
  res.json(req.user);
});

app.listen(3000);

Personnaliser les revendications du jeton d’identifiant

Par défaut, l’en-tête Logto-ID-Token inclut les revendications OIDC standard (par exemple sub, name et email). Pour inclure des revendications étendues telles que les rôles ou les données d’organisation, les deux éléments suivants doivent être configurés :

1. Bascule du locataire : Activez la revendication dans Console > Custom JWT > ID token.
2. Scopes de la Protected App : Dans les paramètres de votre Protected App, sélectionnez la portée correspondante sous ID token claims > Additional scopes.

Les revendications étendues sont incluses dans le jeton d’identifiant transmis uniquement lorsque la revendication est activée dans Custom JWT et que la portée correspondante est sélectionnée pour la Protected App. Voir Jeton d’identifiant personnalisé pour la liste complète des scopes et revendications étendus.

Portée	Revendications
custom_data	custom_data
identities	identities, sso_identities
roles	roles
urn:logto:scope:organizations	organizations, organization_data
urn:logto:scope:organization_roles	organization_roles

Obtenir l’hôte d’origine

Si vous avez besoin d’obtenir l’hôte d’origine demandé par le client, vous pouvez utiliser l’en-tête Logto-Host ou x-forwarded-host.

Personnaliser les règles d’authentification

Par défaut, la Protected App protège toutes les routes. Si vous souhaitez personnaliser les règles d’authentification, vous pouvez définir le champ "Custom authentication rules" dans la Console.

Les expressions régulières sont prises en charge, voici deux scénarios d’utilisation :

1. Pour ne protéger que les routes /admin et /privacy par authentification : ^/(admin|privacy)/.*
2. Pour exclure les images JPG de l’authentification : ^(?!.*\.jpg$).*$

Développement local

La Protected App est conçue pour fonctionner avec votre serveur d’origine. Cependant, si votre serveur d’origine n’est pas accessible publiquement, vous pouvez utiliser un outil comme ngrok ou Cloudflare Tunnels pour exposer votre serveur local à Internet.

Transition vers l’intégration SDK

La Protected App est conçue pour simplifier le processus d’authentification. Cependant, si vous décidez de passer à une intégration SDK pour un meilleur contrôle et une personnalisation accrue, vous pouvez créer une nouvelle application dans Logto et configurer l’intégration SDK. Pour une transition en douceur, vous pouvez réutiliser les configurations d’application de la Protected App. La Protected App est en réalité une "Traditional Web App" dans Logto, vous pouvez trouver l’"AppId" et l’"AppSecret" dans les paramètres de l’application. Une fois la transition terminée, vous pouvez retirer la Protected App de votre application.

Ressources associées

Protected App : Construisez l’authentification de votre application en quelques clics. Aucun code requis.

La motivation derrière la Protected App

La façon la plus rapide de construire un système d’authentification