Aller au contenu principal

Inscription des utilisateurs

Implémentez l'inscription des utilisateurs dans votre application.


Méthodes d'inscription

MéthodeFlux
Email/Mot de passeL'utilisateur fournit email + mot de passe
Connexion socialeOAuth via Google, GitHub, LinkedIn, Facebook
Base de données personnaliséeAuthentifier contre une base de données existante

Inscription Email/Mot de passe

Exemples d'implémentation

'use client';

import { useRegistration } from '@syauth/nextjs';
// ... code du composant ...

Champs requis

ChampRequisDescription
emailAdresse email valide
passwordMinimum 8 caractères
first_namePrénom de l'utilisateur
last_nameNom de famille de l'utilisateur

Exigences du mot de passe

Les mots de passe doivent satisfaire ces exigences :

  • Minimum 8 caractères
  • Au moins une lettre majuscule
  • Au moins une lettre minuscule
  • Au moins un chiffre
  • Au moins un caractère spécial

Via Login Universel

Lors de l'utilisation du Login Universel, les utilisateurs peuvent s'inscrire directement :

const { loginWithRedirect } = useSyAuth();

// Redirige vers le Login Universel qui a les options de connexion et d'inscription
loginWithRedirect();

La page de Login Universel inclut un lien « Créer un compte ».


API d'inscription

Pour les implémentations personnalisées :

POST https://api.syauth.com/e/v1/register/
Content-Type: application/json
X-API-Key: votre-api-key

{
"email": "[email protected]",
"password": "MotDePasse123!",
"first_name": "Jean",
"last_name": "Dupont"
}

Réponse :

{
"success": true,
"message": "Inscription réussie. Veuillez vérifier votre email.",
"user": {
"id": "uuid",
"email": "[email protected]",
"first_name": "Jean",
"last_name": "Dupont",
"email_verified": false
}
}

Flux post-inscription

Après l'inscription :

  1. Email de vérification envoyé - L'utilisateur reçoit un email avec un code de vérification
  2. L'utilisateur vérifie l'email - Clique sur le lien ou entre le code
  3. Compte activé - L'utilisateur peut maintenant se connecter
Inscription → Email envoyé → Vérifier le code → Compte actif → Connexion

Gestion des erreurs

ErreurDescriptionSolution
email_already_existsEmail déjà inscritInviter à se connecter à la place
invalid_emailFormat d'email invalideValider le format de l'email
weak_passwordLe mot de passe ne satisfait pas les exigencesAfficher les exigences
invalid_api_keyToken API manquant ou invalideVérifier la configuration
const { register, error } = useRegistration();

// L'erreur est une chaîne avec le message d'erreur
if (error === 'email_already_exists') {
// Gérer l'email en doublon
}

Configuration

L'inscription nécessite un token API :

# .env.local
NEXT_PUBLIC_SYAUTH_API_KEY=votre-api-key

Obtenez votre token API depuis le Tableau de bord dans les paramètres de votre application.


Prochaines étapes