OAuth (GitHub / GitLab) et GitHub App

OAuth (GitHub / GitLab) et GitHub App

Guide complet des flows d'inscription et d'authentification, y compris le flux d'installation GitHub App et la génération de jetons de connexion

Comprend : inscription via providers, autorisations, callbacks, gestion des tokens côté client, et génération de jetons de connexion pour GitHub App.

Ce document couvre

Inscription & Connexion

Inscription par formulaire (email/mot de passe), ou via OAuth (GitHub / GitLab) et via installation GitHub App.

GitHub App

Flux d’installation, récupération des dépôts accessibles, et génération d’un jeton temporaire (JWT) pour connexion automatique.

Gestion des tokens

Extraction des tokens côté client, stockage temporaire et détection d’expiration pour ré-authentification.

Composants client

IFrame de signup, pages de callback et formulaires d’ajout de dépôt via OAuth ou GitHub App.

Sécurité & limites

Bonnes pratiques : scopes minimaux, cookies sécurisés, durée de vie courte pour jetons de login.

Scénarios avancés

Comportements lorsqu’un email n’existe pas, mise à jour d’un compte existant, et ré-autorisation quand un token expire.

Intro Ce guide explique, pas à pas, comment utiliser les différents mécanismes d’authentification disponibles : OAuth classique pour GitHub et GitLab, l’installation et le flux spécifique GitHub App (utilisé pour accéder aux dépôts d’une organisation/utilisateur avec permissions d’application), ainsi que la manière dont un jeton de connexion temporaire (JWT) peut être utilisé pour connecter automatiquement un utilisateur après l’installation d’une GitHub App. Vous y trouverez aussi les flux clients essentiels : comment initier l’auth OAuth, comment extraire les tokens à la redirection, et comment gérer les erreurs et la ré-authentification.

À propos des comptes créés via OAuth

Important : si vous vous inscrivez via GitHub ou GitLab et qu’aucun compte n’existe déjà avec l’email fourni par le provider, un nouveau compte sera créé automatiquement. Le système peut aussi attribuer des crédits de bienvenue lors d’une première inscription via OAuth.

Inscription via formulaire (email / mot de passe)

1

Étape 1 : Ouvrir la page d'inscription

Accéder à la page d’inscription depuis le bouton “S’inscrire” du site.

2

Étape 2 : Remplir le formulaire

Saisir votre adresse e‑mail, choisir un mot de passe sécurisé, et compléter les champs demandés (nom, langue, etc.). Accepter les conditions si demandé.

3

Étape 3 : Valider et confirmer

Soumettre le formulaire. Vous recevrez éventuellement un e‑mail de confirmation selon la configuration.

4

Étape 4 : Accès initial & crédits

Après validation, le compte est créé. Si une attribution automatique de crédits est configurée, elle sera appliquée automatiquement.

5

Étape 5 : Connexion

Se connecter avec l’email et le mot de passe choisis depuis la page de connexion.

Inscription / Connexion via GitHub (OAuth classique)

1

Étape 1 : Cliquer sur 'S'inscrire avec GitHub' ou 'Se connecter avec GitHub'

Depuis la page d’inscription ou de connexion, choisir l’option GitHub.

2

Étape 2 : Autoriser l'application

Vous serez redirigé vers GitHub pour autoriser l’accès demandé (scopes listés : lecture du profil et des emails au minimum). Examiner et accepter les permissions.

3

Étape 3 : Retour sur la plateforme

Après acceptation, vous êtes redirigé vers la plateforme. Si l’email GitHub est disponible et ne correspond à aucun compte existant, un nouveau compte sera créé automatiquement.

4

Étape 4 : Compléter profil si nécessaire

Si l’email GitHub n’est pas fourni par le provider, l’interface peut vous inviter à saisir une adresse e‑mail pour compléter l’inscription.

5

Étape 5 : Accès au dashboard

Une fois connecté, vous êtes redirigé vers votre tableau de bord ou vers l’URL finale choisie avant le flux OAuth.

6

Étape 6 : Cas particulier — compte existant

Si un compte existe déjà avec le même email, les informations GitHub sont liées au compte existant (mise à jour du nom, avatar, identifiant provider).

Inscription / Connexion via GitLab (PKCE)

1

Étape 1 : Démarrer la connexion GitLab

Cliquer sur “Se connecter avec GitLab”. Le flux utilise PKCE : une clé de vérification est générée côté client et conservée temporairement.

2

Étape 2 : Autoriser l'accès sur GitLab

Sur GitLab, autoriser les scopes demandés (accès API, lecture des dépôts et utilisateur).

3

Étape 3 : Retour & échange de code

Vous revenez sur la plateforme ; la clé PKCE côté client est utilisée pour échanger le code d’autorisation contre un token sécurisé.

4

Étape 4 : Création ou liaison de compte

Si l’email GitLab est présent et aucun compte n’existe, un compte sera créé ; sinon le compte existant sera mis à jour.

5

Étape 5 : Gestion du token

Le token d’accès GitLab est stocké en sécurité (durée d’expiration à surveiller) et utilisé pour opérations GitLab (vérifier dépôts, webhooks, etc.).

6

Étape 6 : Ré-authentification

Si le token expire, l’utilisateur doit relancer l’authentification GitLab (PKCE préserve la sécurité du flux).

Installation et flux GitHub App (ajout de dépôts & création de compte)

1

Étape 1 : Choisir 'Installer la GitHub App'

Depuis l’interface, sélectionner l’option d’installation de la GitHub App pour ajouter des dépôts ou s’inscrire via l’installation.

2

Étape 2 : Sélectionner l'organisation ou l'utilisateur

Sur GitHub, choisir où installer l’application (compte personnel ou organisation) et sélectionner les dépôts autorisés ou toute l’organisation selon vos besoins.

3

Étape 3 : Retour & traitement de l'installation

Après installation, vous êtes redirigé vers la page d’installation de la plateforme. Le système récupère la liste des dépôts accessibles à la GitHub App.

4

Étape 4 : Lier ou créer le compte utilisateur

Si l’installateur a un compte existant avec le même email, il est lié ; sinon, un compte est créé (si l’email est disponible) — sinon un compte temporaire peut être créé et l’utilisateur invité à compléter son email.

5

Étape 5 : Jeton de connexion temporaire (auto-login)

Si l’utilisateur possède déjà un mot de passe sur la plateforme, un jeton de connexion court (JWT) peut être émis pour permettre une connexion automatique sans re-saisir le mot de passe. Ce jeton est temporaire (durée courte, ex. quelques minutes).

6

Étape 6 : Sélectionner les dépôts à connecter

Choisir les dépôts à synchroniser avec le projet de la plateforme. Les dépôts listés sont ceux accessibles à l’installation GitHub App.

7

Étape 7 : Rappels de permissions

Si des opérations demandent des scopes additionnels (ex : création de webhooks), il peut être nécessaire de réinstaller ou de mettre à jour les permissions de la GitHub App.

8

Étape 8 : Ré-authentification installation

Si l’installation est supprimée ou si l’app perd des permissions, relancer le processus d’installation pour restaurer l’accès.

Durée de vie des jetons de connexion

Préférez les jetons de connexion temporaires (quelques minutes) pour opérations d’auto-login. Ils réduisent la surface d’attaque si interceptés et obligent à une authentification complète pour actions sensibles.

Scopes minimaux et principe du moindre privilège

Autorisez uniquement les permissions nécessaires (lecture profil + email pour login, permissions repo/webhook seulement si vous devez gérer des dépôts). Demander trop de droits peut empêcher des utilisateurs d’accepter l’autorisation.

Cas où l'email n'est pas fourni par GitHub/GitLab

Certains comptes GitHub/GitLab n’ont pas d’email public : dans ce cas, la plateforme peut créer un compte temporaire ou inviter l’utilisateur à fournir un email. Sans email vérifié, certaines fonctionnalités (communication, restauration de mot de passe) peuvent être limitées.

Connexion via GitHub App token (auto-login après installation)

1

Étape 1 : Installation complétée

Après l’installation, si la plateforme détecte que l’utilisateur existe et a un mot de passe, elle peut proposer une connexion automatique.

2

Étape 2 : Jeton de connexion temporaire

La plateforme émet un jeton de connexion court (JWT) attaché à l’utilisateur. Ce jeton contient des informations minimalistes (type, id utilisateur, id provider) et une expiration courte.

3

Étape 3 : Utilisation du jeton côté client

Le client reçoit le jeton et l’utilise immédiatement pour établir la session sans demander le mot de passe (redirection automatique vers le dashboard).

4

Étape 4 : Expiration et sécurité

Le jeton expire rapidement (ex : 5 minutes). Si l’utilisateur ne finalise pas la connexion dans ce délai, il devra se reconnecter via le flux standard.

5

Étape 5 : Reprise manuelle

Si l’auto-login échoue, l’utilisateur peut se connecter manuellement (email/mot de passe) ou relancer l’authentification GitHub.

Flux client : comment initier et récupérer tokens (bonnes pratiques pour développeurs d'interface)

1

Étape 1 : Déclencher l'auth depuis l'UI

Offrir des boutons clairs “Se connecter avec GitHub / GitLab” et “Installer la GitHub App”. Expliquer les permissions demandées en un court paragraphe pour rassurer l’utilisateur.

2

Étape 2 : Sauvegarder l'URL de redirection finale

Avant la redirection vers le provider, stocker l’URL finale désirée (dashboard ou page d’origine) pour y revenir après l’authentification.

3

Étape 3 : PKCE pour GitLab

Pour GitLab, générer un code_verifier côté client et un code_challenge associé ; conserver le code_verifier de manière temporaire (cookie sécurisé ou stockage de session) pour l’échange final.

4

Étape 4 : Récupérer le paramètre 'code' ou tokens

Au retour du provider, la page de callback doit extraire le code d’autorisation (ou les tokens) depuis l’URL, puis effectuer l’échange/validation côté serveur ou via le flow prévu.

5

Étape 5 : Stockage local & expiration

Ne jamais stocker durablement des tokens d’accès bruts côté client. Utiliser des cookies sécurisés pour les éléments de flux (ex : redirection finale, code_verifier) et laisser le serveur gérer l’accès prolongé si nécessaire.

6

Étape 6 : Afficher l'état à l'utilisateur

Informer l’utilisateur des étapes : “Autorisation acceptée”, “Compte créé”, “Connexion terminée”. En cas d’erreur, donner une action corrective (réessayer l’authentification / vérifier les permissions).

7

Étape 7 : Rafraîchir / Ré-authentifier

Si une opération échoue à cause d’un token expiré, proposer un bouton “Reconnecter GitHub/GitLab” et expliquer pourquoi (token expiré / permissions modifiées).

Connexion classique (email / mot de passe) — Rappels et bonnes pratiques

1

Étape 1 : Page de connexion

Remplir email et mot de passe, cliquer sur “Se connecter”.

2

Étape 2 : Gestion des erreurs

Si identifiants incorrects, l’interface doit afficher un message clair et une option pour réinitialiser le mot de passe.

3

Étape 3 : Sessions et sécurité

Activer l’authentification à 2 facteurs si disponible, et toujours se déconnecter sur les appareils publics.

4

Étape 4 : Liaison avec OAuth

Après une connexion par email, l’utilisateur peut lier ensuite GitHub/GitLab à son compte pour faciliter l’accès futur.

Réinitialiser mot de passe (flow utilisateur)

1

Étape 1 : Demande de réinitialisation

Cliquer sur “Mot de passe oublié”, renseigner son e‑mail et soumettre la demande.

2

Étape 2 : Réception de l'email

Recevoir un e‑mail contenant les instructions et un lien sécurisé pour définir un nouveau mot de passe.

3

Étape 3 : Définir un nouveau mot de passe

Suivre le lien, saisir un nouveau mot de passe respectant les règles de complexité, puis confirmer.

4

Étape 4 : Connexion après reset

Une fois le mot de passe changé, se connecter avec le nouveau mot de passe. Si le compte est lié à GitHub/GitLab, ces options restent disponibles.

5

Étape 5 : Erreurs courantes

Si vous ne recevez pas l’e‑mail : vérifier le dossier spam, s’assurer que l’adresse est correcte, ou contacter le support.

  • Type : connexion basée sur l’utilisateur via le provider.
  • Idéal pour : authentification simple, création automatique de comptes, accès limité au profil et email.
  • Avantages : expérience utilisateur fluide pour login/sign-up, pas d’installation d’app nécessaire.
  • Limitations : accès aux dépôts d’organisation restreint si l’utilisateur n’a pas accordé explicitement l’accès aux dépôts, et certains emails peuvent être absents (compte privé).
  • Type : installation d’une application sur un compte/organisation GitHub qui donne des permissions au niveau des dépôts.
  • Idéal pour : automatisations, accès centralisé aux dépôts d’une organisation, création de webhooks et actions côté plateforme.
  • Avantages : permissions granulaires, token d’installation dédié, meilleur contrôle administratif.
  • Limitations : nécessite installation explicite, peut demander un jeton d’auto-login pour connecter l’installateur, gestion des permissions additionnelles parfois nécessaire.

Comparatif rapide :

  • OAuth classique : meilleur pour login utilisateur individuel.
  • GitHub App : meilleur pour accès organisationnel et opérations sur dépôts.

Avant / Après installation GitHub App :

  • Avant : l’utilisateur doit fournir un token personnel ou autoriser dépôt par dépôt.
  • Après : l’application liste directement les dépôts accessibles, simplifiant la connexion et la gestion.

Permissions et portée des accès — vérifiez avant d'accepter

Ne pas accepter des permissions plus élevées que nécessaire. Les permissions demandées déterminent ce que la plateforme pourra faire (par ex. lecture/écriture sur les dépôts, gestion de webhooks). En entreprise, demandez au propriétaire de l’organisation si nécessaire.

Que faire si la liste des dépôts est incomplète ?

Vérifiez que vous avez installé l’application pour l’organisation correcte et que vous avez sélectionné les dépôts souhaités au moment de l’installation. Parfois, il faut modifier l’installation pour ajouter des dépôts supplémentaires.

Ajouter un dépôt à un projet (via OAuth ou GitHub App)

1

Étape 1 : Ouvrir le formulaire 'Ajouter un dépôt'

Aller sur la page du projet > onglet Repos > Ajouter un dépôt.

2

Étape 2 : Choisir la méthode

Sélectionner GitHub/GitLab OAuth ou choisir GitHub App si vous avez installé l’app.

3

Étape 3 : Autoriser & sélectionner le dépôt

Autoriser l’application si nécessaire, puis dans la liste choisir le dépôt à connecter.

4

Étape 4 : Vérifier les webhooks et permissions

La plateforme vérifie si elle peut créer les webhooks nécessaires ; si non, proposer la ré-authentification ou instructions pour ajouter la clef de webhook.

5

Étape 5 : Lancer la synchronisation

Une fois connecté, lancer la synchronisation initiale du dépôt (indexation, récupération des commits, etc.). Surveiller la progression et les éventuelles erreurs d’autorisation.

Frequently Asked Questions

Conclusion Ce guide détaille les flux d’inscription et d’authentification via GitHub, GitLab et GitHub App, ainsi que les meilleures pratiques côté client pour initier et gérer ces flux. En résumé : privilégiez les scopes minimaux, utilisez des jetons temporaires pour l’auto-login, et proposez des messages clairs à l’utilisateur lors des étapes d’autorisation et de ré-authentification.

Besoin d'aide ?

Si vous rencontrez un blocage (permissions manquantes, installation incomplète, tokens expirés), prenez une capture d’écran de la demande de permission et contactez le support en indiquant le contexte : provider utilisé, action tentée, et message d’erreur affiché.