Configuration d’Auth0 (SPA + API)

Configuration d’Auth0 pour le scénario d’architecture SPA + API

Dans cette section, nous passerons en revue toutes les configurations à appliquer dans l’Auth0 Dashboard.

​

Créer l’API

Accédez à la section APIs de l’Auth0 Dashboard, puis cliquez sur le bouton Create API.

Vous devrez fournir les renseignements suivants pour votre API :

• Nom : un nom convivial pour l’API. Cela n’affecte aucune fonctionnalité.
• Identifiant : un identifiant unique pour l’API. Nous vous recommandons d’utiliser une URL, mais notez qu’elle n’a pas besoin d’être accessible publiquement, car Auth0 n’appellera jamais votre API. Cette valeur ne peut pas être modifiée par la suite.
• Algorithme de signature : l’algorithme utilisé pour signer les jetons. Les valeurs possibles sont HS256 et RS256. Si vous sélectionnez RS256, le jeton sera signé à l’aide de la clé privée du locataire. Pour en savoir plus sur les algorithmes de signature, consultez Signing Algorithms.

Remplissez les renseignements requis, puis cliquez sur le bouton Create.

​

Configurer les scopes

Une fois l’application créée, vous devrez configurer les scopes que les applications peuvent demander lors de l’autorisation.

Dans les paramètres de votre API, accédez à l’onglet permission. Dans cette section, vous pouvez ajouter les scopes pour notre cas d’utilisation : read:timesheets, create:timesheets, delete:timesheets et approve:timesheets.

​

Créer l’application

Il existe quatre types d’applications dans Auth0 :

• Application native (utilisée par les applications mobiles ou de bureau),
• Application Web monopage,
• Application Web classique et
• Application machine à machine (utilisée par les CLI, les démons ou les services qui s’exécutent sur votre backend).

Dans ce scénario, nous voulons créer une nouvelle application pour notre SPA; nous utiliserons donc le type d’application Single-Page Web App.

Pour créer une nouvelle application, accédez à l’Auth0 Dashboard, puis cliquez sur l’option de menu Applications à gauche. Cliquez sur le bouton + Create Application.

Attribuez un nom à votre application (nous utiliserons Timesheets SPA) et sélectionnez Single-Page Web App comme type.

Cliquez sur Create.

C’est tout pour le moment. Une fois l’implémentation de la SPA terminée, nous reviendrons dans l’Auth0 Dashboard et dans les paramètres de cette application pour apporter quelques modifications à sa configuration.

​

Configurer Authorization Extension

Vous devez vous assurer qu’Authorization Extension est installée pour votre locataire. Consultez la documentation d’Authorization Extension pour savoir comment faire.

​

Définir les permissions

Vous allez maintenant définir les permissions requises en fonction des scopes que vous avez déjà définis : read:timesheets, create:timesheets, delete:timesheets et approve:timesheets.

Dans l’Authorization Extension, cliquez sur l’onglet permission, puis sur le bouton Create Permission.

Dans la boîte de dialogue, saisissez les renseignements pour chaque permission.

Assurez-vous que le nom de la permission est exactement le même que le scope correspondant :

Créez ensuite les permissions pour tous les autres scopes :

​

Définir des rôles

Ensuite, configurons les deux rôles : employee et manager.

Accédez à l’onglet Rôles, cliquez sur le bouton Create Role, puis sélectionnez l’application Timesheets SPA.

Définissez le Nom et la Description à Employee, puis sélectionnez les autorisations delete:timesheets, create:timesheets et read:timesheets. Cliquez sur Save.

Ensuite, suivez le même processus pour créer un rôle Manager, en vous assurant d’avoir sélectionné toutes les autorisations.

​

Attribuer des utilisateurs à des rôles

Vous devez attribuer à tous les utilisateurs le rôle Manager ou le rôle Employee.

Pour ce faire, accédez à l’onglet Utilisateurs dans Authorization Extension et sélectionnez un utilisateur.

Dans l’écran d’information de l’utilisateur, accédez à l’onglet rôles. Cliquez sur Add Role to User, puis sélectionnez le rôle approprié.

​

Configuration de l’Authorization Extension

Vous devez également vous assurer que la Rule de l’Authorization Extension est publiée.

Pour ce faire, cliquez sur votre avatar dans le coin supérieur droit de l’Authorization Extension, puis sélectionnez Configuration.

Assurez-vous que les permissions sont activées, puis cliquez sur Publish Rule.

​

Créer une Rule pour valider les scopes du jeton

La dernière étape de ce processus consiste à créer une Rule pour vérifier si les scopes contenus dans un Jeton d’accès sont valides en fonction des autorisations attribuées à l’utilisateur. Les scopes qui ne sont pas valides pour un utilisateur doivent être retirés du Jeton d’accès.

Dans votre Auth0 Dashboard, accédez à l’onglet Rules. Vous devriez voir la Rule créée par l’Authorization Extension. Cliquez sur le bouton Create Rule et sélectionnez le modèle Empty Rule. Vous pouvez donner un nom à la Rule, par exemple Scopes du jeton d’accès, puis indiquer le code suivant pour la Rule :

function (user, context, callback) {
  var permissions = user.permissions || [];
  var requestedScopes = context.request.body.scope || context.request.query.scope;
  var filteredScopes = requestedScopes.split(' ').filter( function(x) {
    return x.indexOf(':') < 0;
  });

  var allScopes = filteredScopes.concat(permissions);
  context.accessToken.scope = allScopes.join(' ');

  callback(null, user, context);
}

Le code ci-dessus fera en sorte que tous les jetons d’accès ne contiennent que des scopes correctement formatés (p. ex., action:area ou delete:timesheets) qui sont valides selon les permissions de l’utilisateur. Une fois cela fait, vous pouvez cliquer sur le bouton Enregistrer.

Les Rules s’exécutent dans l’ordre où elles sont affichées sur la page Rules. Assurez-vous donc que la nouvelle Rule que vous avez créée est placée sous la Rule de l’Authorization Extension, afin qu’elle s’exécute après la Rule de l’Authorization Extension.