Skip to main content

​
Aperçu

Connectez une instance Auth0 nouvelle ou existante à votre projet Netlify pour améliorer la sécurité, l’évolutivité et la personnalisation de votre application grâce à l’intégration Auth0. Cette intégration vous permet de mettre en place, directement dans votre application, une approche simplifiée de l’identité client. Utilisez la nouvelle intégration pour créer et personnaliser le parcours d’identité de votre projet Netlify. Pour mettre votre application en service rapidement et en toute sécurité, cette intégration :
  • Configure un environnement de production dans Netlify, relié à votre tenant Auth0, en quelques clics seulement.
  • Crée automatiquement une Application dans votre tenant Auth0, connectée à votre projet Netlify.
  • Précharge vos identifiants Auth0 dans Netlify, ce qui vous permet d’éviter certaines étapes manuelles du processus.

​
Prérequis

Avant de commencer à intégrer Auth0 à votre projet Netlify, vous devez mettre en place quelques éléments :
  • Un compte Netlify avec un projet que vous souhaitez intégrer. Consultez Créer votre compte Netlify pour créer un compte.
  • Une application Web qui nécessite une authentification, comme une application React, Vue ou un site statique avec des fonctions sans serveur.

​
Ajouter une intégration Netlify

Après avoir créé votre compte Netlify et ouvert une session dans votre tableau de bord, vous pouvez commencer à ajouter une intégration. Pour ajouter l’intégration Auth0 à un projet Netlify existant :
  1. Dans le tableau de bord Netlify, accédez à Extensions > Directory.
  2. Recherchez Auth0 et sélectionnez Install.
  3. Sélectionnez Install pour lancer l’installation dans votre portail d’intégration Auth0.

​
Connectez votre site

Pour connecter votre site à Auth0 :
  1. Accédez à la Site Configuration du site que vous souhaitez connecter à Auth0.
  2. Dans la barre latérale, sélectionnez Auth0 sous Access & security.
  3. Sélectionnez Link an Auth0 tenant et suivez les instructions pour connecter votre compte Auth0. Si vous n’avez pas encore de compte Auth0, vous pouvez vous inscrire à l’adresse https://auth0.com/signup.
  4. Sélectionnez votre tenant dans la liste déroulante, puis sélectionnez Accept pour autoriser votre compte.
  5. Une fois votre tenant lié, sélectionnez Add tenant.
  6. Remplissez les renseignements requis pour votre tenant et votre application, cochez la case Redeploy site, puis sélectionnez Create site tenant.
  7. Vous devriez maintenant voir le tenant de site lié avec succès dans la configuration de votre site.
Vous devriez maintenant voir votre application cliente et votre API dans votre Auth0 Dashboard, sous Applications.

​
Configurer l’intégration

Lorsque vous intégrez Auth0 à votre projet Netlify, vous devez fournir à votre application des paramètres d’authentification comme le et le domaine Auth0. Si votre application lit ces paramètres à partir de variables d’environnement, ils sont injectés automatiquement par l’extension.
  1. Accédez à votre tableau de bord Netlify.
  2. Accédez à Site configuration > Environment variables.
  3. Cliquez sur Add a variable, puis saisissez :
    • AUTH0_CLIENT_ID (votre Auth0 Client ID)
    • AUTH0_DOMAIN (votre domaine Auth0)
      Ces variables, ainsi que tous les autres renseignements sur l’application, se trouvent dans votre Auth0 Dashboard, sous Applications > [Votre application] > Settings.
Vous devriez maintenant avoir configuré les identifiants Auth0 appropriés pour le déploiement.

​
Renseigner un fichier de configuration

Si votre application lit les paramètres Auth0 à partir d’un fichier, vous pouvez automatiser ce processus pendant la phase de build. Ainsi, votre application dispose toujours des autorisations nécessaires sans que vous ayez à modifier les fichiers manuellement. Pour ce faire :
  1. Accédez à votre tableau de bord Netlify.
  2. Allez à Site configuration > Build & deploy > Build settings.
  3. Modifiez la Build command pour y inclure un script shell avant de lancer le build :
Ce script crée un fichier JSON nommé auth_config.json et le renseigne à l’aide des variables d’environnement AUTH0_CLIENT_ID et AUTH0_DOMAIN définies ci-dessus, afin que l’application dispose des bons paramètres Auth0 dans l’environnement d’exécution.

​
Gérer l’intégration

Après avoir ajouté l’intégration Auth0 à votre projet Netlify, l’ crée une nouvelle application pour gérer et personnaliser votre workflow CIAM.
  1. Accédez à l’Auth0 Dashboard.
  2. Sélectionnez Applications > Applications > [Votre application Netlify]
  3. Confirmez l’URI de l’application Netlify sous Settings > Application URIs.
Vous pouvez maintenant personnaliser et modifier cette application comme toute autre application dans votre Auth0 Dashboard.