Laravel et Passkeys : une authentification biométrique et sans mot de passe

Sécuriser son application au-delà du mot de passe

Les mots de passe font partie de nos habitudes depuis longtemps, mais leur gestion devient de moins en moins évidente avec l’augmentation du nombre de comptes et d’exigences : règles de complexité, réinitialisations ou encore fuites de données.

Même l’utilisation de gestionnaires ne fait qu’atténuer le problème, un mot de passe reste un secret fragile que l’utilisateur doit saisir et conserver.

Le phishing, lui, gagne en sophistication : les pages de connexion factices sont de plus en plus crédibles, et une simple inattention peut suffire à compromettre un compte.

Face à ces limites, les Passkeys offrent une alternative plus moderne. Basées sur WebAuthn, elles remplacent le mot de passe par une paire de clefs cryptographiques.

L’authentification se fait via biométrie ou clef de sécurité physique : le serveur, lui, ne fait que vérifier la signature produite par l’appareil. Avec ce système, plus de mot de passe et vous réduisez ainsi fortement l’exposition de vos applications aux attaques.

Comment fonctionnent les Passkeys

Une Passkey repose sur une paire de clefs comparable à une clef SSH : une clef publique envoyée au serveur et une clef privée conservée dans l’appareil. Le navigateur orchestre automatiquement l’échange entre les deux.

Lors de l’enregistrement, seule la clef publique est transmise au serveur. La clef privée, elle, reste protégée dans l’espace sécurisé du téléphone ou de l’ordinateur et peut, selon l’écosystème, être synchronisée avec d’autres appareils du même utilisateur.

Au moment de la connexion, le serveur envoie un challenge que l’authenticator signe avec la clef privée, généralement après une vérification biométrique ou l’usage d’une clef de sécurité physique. Le serveur utilise ensuite la clef publique pour valider cette signature.

La clef privée ne sort jamais de l’appareil et n’est utilisable que pour le bon domaine, ce qui rend les tentatives de phishing inopérantes.

Implémentation WebAuthn dans Laravel

Maintenant que le fonctionnement est un peu plus clair, on peut passer à l’implémentation avec Laravel.

Le package spatie/laravel-passkeys gère les échanges WebAuthn (challenge, signature, validation), ce qui permet d’intégrer facilement le support des Passkeys dans votre application Laravel.

Installation du package

La première étape consiste à ajouter le package à votre projet via la commande Composer :

1composer require spatie/laravel-passkeys

Configurer le modèle d’authentification

Dans notre exemple, nous utilisons le modèle User pour l’authentification. Mais cela reste flexible, vous pouvez également activer les Passkeys sur d’autres modèles en ajoutant l’interface HasPasskeys et le trait InteractsWithPasskeys, qui leur donnent tout le nécessaire pour gérer ce mode de connexion.

 1namespace App\Models;
 2 
 3use Spatie\LaravelPasskeys\Models\Concerns\HasPasskeys; 
 4use Spatie\LaravelPasskeys\Models\Concerns\InteractsWithPasskeys; 
 5// ...
 6 
 7class User extends Authenticatable implements HasPasskeys 
 8{
 9    use HasFactory;
10    use Notifiable;
11    use InteractsWithPasskeys; 
12 
13    // ...
14}

Publier les migrations

Pour mettre en place les tables requises, il suffit d’exécuter la migration du package : elle crée la table passkeys et les colonnes nécessaires pour enregistrer les identifiants et les données liées à la Passkey de l’utilisateur.

1php artisan vendor:publish --tag="passkeys-migrations"
2php artisan migrate

Configurer la couche WebAuthn côté navigateur

Pour permettre au navigateur de créer une clef, mais aussi de déclencher la procédure de connexion, on utilise la bibliothèque @simplewebauthn/browser :

1npm install @simplewebauthn/browser

Une fois installée, il faut charger les fonctions WebAuthn dans votre JavaScript. Dans notre exemple, nous les ajoutons dans resources/app.js :

1import {
2    browserSupportsWebAuthn,
3    startAuthentication,
4    startRegistration,
5} from '@simplewebauthn/browser';
6 
7window.browserSupportsWebAuthn = browserSupportsWebAuthn;
8window.startAuthentication = startAuthentication;
9window.startRegistration = startRegistration;

Une fois le code importé, il faut recompiler vos assets pour que les changements soient pris en compte :

1npm run build

Ces fonctions seront ensuite utilisées automatiquement lorsque les composants Spatie déclencheront la création d’une clef ou une authentification via le navigateur.

Intégrer les routes d’authentification

Le package expose les routes nécessaires au dialogue entre votre application et le navigateur. Il suffit de les ajouter dans votre fichier routes/web.php :

1Route::passkeys();

Ces routes gèrent les échanges utilisés lors de la création et de l’utilisation d’une clef d’authentification.

Gestion des clés d’authentification

Pour permettre à un utilisateur d’enregistrer une clef sur son compte, Spatie fournit également un composant prêt à l’emploi. Dans la page de profil, ajoutez simplement :

1<livewire:passkeys />

Ce composant lance l'enregistrement de clefs et transmet les informations générées par le navigateur au serveur.

Connexion sans mot de passe

La dernière étape consiste à intégrer le bouton de connexion sur votre page dédiée, afin de permettre l’authentification de l’utilisateur :

1<x-authenticate-passkey />

Son déclenchement lance l’authentification et envoie la signature au serveur pour valider l’accès.

Adapter l’implémentation à votre contexte

La configuration présentée dans cette prise en main reste volontairement succincte afin de vous permettre de découvrir rapidement le fonctionnement du package.

Dans une application réelle, l’intégration peut aller bien plus loin : vous pouvez choisir un autre modèle pour l’authentification, ajuster les routes et les actions associées, modifier les composants fournis ou encore intégrer toute la logique avec Inertia.

La documentation officielle détaille l’ensemble de ces possibilités si vous souhaitez pousser la personnalisation plus loin.

En résumé

Cette prise en main montre comment intégrer une authentification moderne dans une application Laravel en s’appuyant sur WebAuthn et le package de Spatie.

En quelques étapes, il est possible de remplacer l'authentification basée sur le mot de passe par un système plus robuste, reposant sur une preuve cryptographique locale et pris en charge nativement par les navigateurs.

Au-delà de l’aspect technique, cette approche améliore réellement l’expérience : moins de frictions lors de la connexion, une sécurité renforcée face aux attaques courantes et un geste d’authentification plus naturel pour l’utilisateur !

Rémy Guillermic

Développeur full stack spécialisé dans l'écosystème de Laravel