La gestion de la réinitialisation de mot de passe est souvent un défi pour les développeurs.
Une mauvaise implémentation peut conduire à des failles de sécurité, exposant les données sensibles des utilisateurs.
Cet article explore comment configurer un système de réinitialisation de mot de passe sécurisé avec Laravel, en mettant l’accent sur les meilleures pratiques.
Initiez-vous à Laravel et réalisez votre première application en toute confiance.
Alors, passons maintenant à la mise en place de la logique pour le formulaire de réinitialisation de mot de passe. C’est parti
Configurer RestController Laravel
Le contrôleur RestController est responsable de la gestion du processus de réinitialisation du mot de passe. Il permet d’afficher le formulaire de réinitialisation et de traiter la soumission du formulaire pour mettre à jour le mot de passe de l’utilisateur.
Affichage du formulaire de réinitialisation
La première étape consiste à afficher le formulaire permettant à l’utilisateur de réinitialiser son mot de passe. Pour ce faire, vous devez vérifier la validité du token de réinitialisation passé dans l’URL. Ce token est généralement généré lors de la demande de réinitialisation et est stocké temporairement dans la base de données. Lorsque l’utilisateur accède à la page de réinitialisation, le contrôleur RestController vérifie si le token est valide avant d’afficher le formulaire.
Voici un exemple de code pour afficher le formulaire :
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use DB;
class RestController extends Controller
{
//
public function index(string $token) // formulaire de réinitialisation de mot de passe
{
$password_reset = DB::table('password_reset_tokens')->where('token', $token)->first();
abort_if(!$password_reset, 403);
$data = [
'title' => $description = 'Réinitialisation de mot de passe - ' . config('app.name'),
'description' => $description,
'password_reset' => $password_reset,
];
return view('auth.reset', $data);
}
}
Explication du Code :
- Vous récupérez le token de réinitialisation passé dans l’URL et vous le cherchez dans la base de données.
- Si le token est trouvé, vous affichez le formulaire de réinitialisation. Sinon, une erreur est générée.
- Vous passez les données nécessaires (comme le token) à la vue auth.reset.
Créer vue reset.blade.php sécurisée
La vue reset.blade.php contient le formulaire HTML permettant à l’utilisateur de réinitialiser son mot de passe. Elle inclut des champs pour saisir l’email, le nouveau mot de passe, et la confirmation du mot de passe. Le token de réinitialisation est également inclus dans un champ caché pour le transmettre au contrôleur lors de la soumission du formulaire.
Voici un exemple de code pour la vue :
@extends('layouts.main')
@section('content')
<div class="row">
<div class="col-lg-3">
@include('includes/sidebar')
</div>
<!-- /.col-lg-3 -->
<div class="col-lg-9">
@if(session('success'))
<div class="alert alert-success">{{session('success')}}</div>
@endif
@if(session('error'))
<div class="alert alert-danger">{{session('error')}}</div>
@endif
<div class="card mt-4">
<div class="card-body">
<h2 id="laravel-cest-top" class="rb-heading-index-4 card-title"><a href="" data-wpel-link="internal" target="_self" rel="follow noopener noreferrer">Laravel c'est top !</a></h2>
{{-- <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente dicta fugit fugiat hic aliquam itaque facere, soluta. Totam id dolores, sint aperiam sequi pariatur praesentium animi perspiciatis molestias iure, ducimus!</p> --}}
<span class="auhtor">Par <a href="" data-wpel-link="internal" target="_self" rel="follow noopener noreferrer">Hamid</a></span> <br>
<span class="time">Il y'a 1 heure</span>
</div>
</div>
<!-- /.card -->
<div class="card card-outline-secondary my-4">
<div class="card-header">
Réinitialisation de mon mot de passe
</div>
<form action="{{route('post.forgot')}}" method="post">
@csrf
<input type="hidden" name="token" value="{{$password_reset->token}}">
<div class="card-body">
<div class="mb-3 row">
<label for="staticEmail" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="email" id="staticEmail" >
@error('email')
<div class="error">{{$message}}</div>
@enderror
</div>
</div>
<div class="mb-3 row">
<label for="staticEmail" class="col-sm-2 col-form-label">Mot de passe</label>
<div class="col-sm-10">
<input type="Password" class="form-control" name="password" id="staticEmail" >
@error('password')
<div class="error">{{$message}}</div>
@enderror
</div>
</div>
<div class="mb-3 row">
<label for="staticEmail" class="col-sm-2 col-form-label">Confirmer le mot de passe</label>
<div class="col-sm-10">
<input type="Password" class="form-control" name="password_confirmation" id="staticEmail" >
@error('password_confirmation')
<div class="error">{{$message}}</div>
@enderror
</div>
</div>
</div>
<button class="btn btn-primary">Envoyer </button>
</div>
</form>
</div>
<!-- /.card -->
</div>
<!-- /.col-lg-9 -->
</div>
@stop
Explication du Code :
- Affichage des messages :Si des messages de succès ou d’erreur existent, ils sont affichés en haut de la page pour vous informer du statut de la réinitialisation.
- Formulaire de réinitialisation :Ce formulaire contient les champs nécessaires pour saisir l’email, le mot de passe, et la confirmation du mot de passe. Le token est transmis en tant que champ caché pour être utilisé lors de la soumission du formulaire.
- Gestion des erreurs :Si des erreurs de validation sont présentes, elles sont affichées sous chaque champ.
Définir routes pour réinitialisation
Les routes sont utilisées pour lier les URL aux actions du contrôleur. Pour gérer la réinitialisation de mot de passe, vous devez définir deux routes : une pour afficher le formulaire et une pour traiter la soumission du formulaire.
Voici comment vous pouvez définir les routes :
Route::get('reset/{token}', 'RestController@index')->name('reset');
Tester emails avec Mailtrap
Une fois que vous avez configuré tout cela, vous pouvez tester l’envoi d’email en suivant ces étapes :
- Accédez à la page de réinitialisation de mot de passe :Entrez un email valide dans le formulaire.
- Vérifiez votre boîte Mailtrap :Connectez-vous à Mailtrap et vérifiez que le message est bien envoyé.
Voici l’affichage de message sur Mailtrap
- Cliquez sur le lien de réinitialisation :Testez que le lien redirige correctement l’utilisateur vers la page de réinitialisation.
Voici la page d’réinitialisation
Vous avez maintenant une fonctionnalité complète pour permettre aux utilisateurs de réinitialiser leur mot de passe en toute sécurité. Cette fonctionnalité inclut l’envoi d’un lien de réinitialisation par email, la génération d’un token unique, et l’utilisation de Mailtrap pour tester l’envoi des mails en toute sécurité.
Formez-vous gratuitement avec Alphorm !
Maîtrisez les compétences clés en IT grâce à nos formations gratuites et accélérez votre carrière dès aujourd'hui.
FAQ
Comment configurer le contrôleur pour la réinitialisation de mot de passe ?
Quel est le rôle du token dans la réinitialisation de mot de passe ?
Comment fonctionne la vue reset.blade.php dans Laravel ?
Comment tester l'envoi d'email avec Mailtrap ?
Quelles sont les meilleures pratiques de sécurité pour la réinitialisation de mot de passe ?
Conclusion
La réinitialisation de mot de passe est un composant crucial de la sécurité utilisateur. Quelles autres fonctionnalités de sécurité envisagez-vous d’implémenter dans votre application Laravel ?
