Supabase Auth : OAuth, magic links et SMS OTP : tutoriel 2026

📍 Article principal : Supabase 2026 : guide complet.

Supabase Auth = GoTrue. Email/password, magic links, OAuth, SMS OTP, JWT. Ce tutoriel détaille la configuration validée pour SaaS B2B et apps mobile francophones.

Prérequis

• Supabase en production (voir tutoriel installation).
• SMTP configuré pour magic links.
• OAuth providers credentials (Google, GitHub, etc).
• Niveau : intermédiaire.
• Temps : 1-2h.

Étape 1 — Email/Password

Studio → Authentication → Providers → Email. Activer. Configurer :

• Confirm email : ON (obligatoire production).
• Min password length : 12.
• Password requirements : alpha + digits.

Étape 2 — Magic Links

Email link unique sans password. UX moderne :

const { error } = await supabase.auth.signInWithOtp({
  email: 'amadou@example.com',
  options: {
    emailRedirectTo: 'https://votre-app.com/dashboard'
  }
});

User reçoit email avec lien magic. Clic = connecté.

Étape 3 — OAuth Google

Console Google Cloud → APIs & Services → Credentials → OAuth 2.0 Client IDs → Web application :

• Authorized redirect URIs : https://api.votre-app.com/auth/v1/callback.

Copier client_id et client_secret. Studio Supabase → Auth → Providers → Google → Enable + paste.

const { error } = await supabase.auth.signInWithOAuth({
  provider: 'google',
  options: { redirectTo: 'https://votre-app.com/dashboard' }
});

Étape 4 — OAuth GitHub

GitHub → Settings → Developer settings → OAuth Apps → New :

• Authorization callback URL : https://api.votre-app.com/auth/v1/callback.

Copier credentials dans Studio.

Étape 5 — OAuth Apple (iOS)

Apple Developer Account → Certificates, IDs & Profiles → Service IDs. Configuration plus complexe (private key .p8). Documentation Supabase détaillée.

Étape 6 — SMS OTP via Twilio

Pour app mobile Afrique de l’Ouest, SMS OTP via Twilio :

• Twilio account → Verify Service.
• Studio Supabase → Auth → Providers → Phone → Twilio + credentials.

const { error } = await supabase.auth.signInWithOtp({
  phone: '+221700000000'
});
// User reçoit SMS code 6 chiffres

const { error } = await supabase.auth.verifyOtp({
  phone: '+221700000000',
  token: '123456',
  type: 'sms'
});

Étape 7 — Session management

// Get current user
const { data: { user } } = await supabase.auth.getUser();

// Listen auth changes
supabase.auth.onAuthStateChange((event, session) => {
  if (event === 'SIGNED_IN') router.push('/dashboard');
  if (event === 'SIGNED_OUT') router.push('/login');
});

// Sign out
await supabase.auth.signOut();

Étape 8 — JWT custom claims

Pour ajouter role/org dans JWT :

CREATE OR REPLACE FUNCTION add_user_meta_data() RETURNS trigger AS $$
BEGIN
  NEW.raw_user_meta_data = NEW.raw_user_meta_data || jsonb_build_object(
    'role', (SELECT role FROM profiles WHERE id = NEW.id),
    'org_id', (SELECT organization_id FROM profiles WHERE id = NEW.id)
  );
  RETURN NEW;
END;
$$ LANGUAGE plpgsql;

Étape 9 — Password reset

// Demande reset
await supabase.auth.resetPasswordForEmail('email@example.com', {
  redirectTo: 'https://votre-app.com/reset-password'
});

// Page reset
await supabase.auth.updateUser({ password: 'new-password' });

Étape 10 — MFA TOTP (optionnel)

Supabase 2.0+ supporte MFA TOTP. Config Studio → Auth → MFA → Enable.

Erreurs fréquentes

Adaptation au contexte ouest-africain

Quatre précisions. SMS OTP coût : Twilio +221 ~0.05 USD/SMS. Pour 1000 OTP/mois = 50 USD. Africa SMS provider Africa’s Talking peut être moins cher. Magic links : préféré sur SMS pour éviter coût. Email arrive aussi rapidement. OAuth Google : 90% des Africains francophones ont compte Gmail. UX login en 2 clics. Apple Sign In : moins prévalent en Afrique mais obligatoire pour App Store iOS.

Tutoriels frères

• Déployer Supabase
• Storage upload images

FAQ

WhatsApp OTP ? Pas natif. Custom integration via Twilio WhatsApp ou Meta Business API.

Multi-factor mandatory ? Non par défaut. Activable par utilisateur.

Auth UI ready-made ? @supabase/auth-ui-react component prêt à l’emploi.

Session refresh auto ? Oui SDK refresh tokens auto.

Migration depuis Auth0/Firebase ? Outils communautaires + JWT generation custom.

Pour aller plus loin

• 🔝 Pilier : Guide complet Supabase 2026
• Documentation Auth : supabase.com/docs/guides/auth