0% ont trouvé ce document utile (0 vote)
2 vues25 pages

Module 3 Authentication & Fonctionnalités

Ce module enseigne comment mettre en place un système d'authentification complet avec Laravel Breeze, y compris la protection des routes, la gestion des permissions et la validation des données. Il couvre également l'upload de fichiers et le stockage d'images, ainsi que la gestion des messages flash pour les notifications utilisateur. À la fin, un projet pratique est proposé pour créer un espace membre sécurisé avec un profil utilisateur.

Transféré par

Pride
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
2 vues25 pages

Module 3 Authentication & Fonctionnalités

Ce module enseigne comment mettre en place un système d'authentification complet avec Laravel Breeze, y compris la protection des routes, la gestion des permissions et la validation des données. Il couvre également l'upload de fichiers et le stockage d'images, ainsi que la gestion des messages flash pour les notifications utilisateur. À la fin, un projet pratique est proposé pour créer un espace membre sécurisé avec un profil utilisateur.

Transféré par

Pride
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

MODULE 3

Authentication & Fonctionnalités


Objectifs du Module 3

À la fin de ce module, vous serez capable de :

Mettre en place un système d'authentification complet avec Laravel Breeze

Protéger les routes et gérer les permissions de base

Valider les données soumises par les utilisateurs

Gérer l'upload de fichiers et le stockage d'images


L'Authentification dans Laravel

L'authentification (vérifier qui est l'utilisateur) est


une fonctionnalité complexe mais essentielle pour Concepts clés

la plupart des applications web. Guards :


Définissent comment les utilisateurs sont
authentifiés pour chaque requête (ex:
Laravel rend l'implémentation de session, token).
l'authentification extrêmement simple. Providers :
Les services d'authentification de Définissent comment les utilisateurs sont
Laravel sont configurés dans récupérés depuis le stockage (ex: Eloquent,
config/[Link] . base de données).
Laravel Breeze : Introduction

Laravel Breeze est une implémentation minimale et


minimale et simple de toutes les fonctionnalités Fonctionnalités incluses :

fonctionnalités d'authentification de Laravel. Connexion (Login)

Inscription (Registration)

Il fournit un point de départ parfait pour commencer Réinitialisation de mot de passe

une nouvelle application Laravel avec Vérification d'email

l'authentification déjà configurée. Confirmation de mot de passe


Installer Laravel Breeze

L'installation de Breeze se fait en quelques commandes simples via Composer et Artisan.

1. Installer le package via Composer :

composer require laravel/breeze --dev

2. Exécuter la commande d'installation de Breeze :

php artisan breeze:install

3. Compiler les assets (CSS/JS) et migrer :

npm install
npm run dev
php artisan migrate
Ce que Breeze génère

Une fois installé, Breeze publie plusieurs fichiers dans votre application que vous pouvez modifier librement.

Routes Contrôleurs

Un fichier routes/[Link] est créé et inclus dans Des contrôleurs sont ajoutés dans
[Link] . Il contient toutes les routes app/Http/Controllers/Auth/ pour gérer la logique
d'authentification. de connexion, inscription, etc.

Vues Layouts

Des vues Blade utilisant Tailwind CSS sont publiées Des layouts de base (app et guest) sont créés dans
dans resources/views/auth/ . resources/views/layouts/ .
Protéger les Routes (Middleware)

Protéger une route simple :


Pour restreindre l'accès à
certaines pages aux seuls Route::get('/dashboard', function () {
return view('dashboard');
utilisateurs connectés, on
})->middleware(['auth']);
utilise le middleware auth .
Protéger un groupe de routes :
Si un utilisateur non connecté tente
Route::middleware('auth')->group(function () {
d'accéder à une route protégée, il
Route::get('/profile', [ProfileController::class, 'edit']);
sera automatiquement redirigé vers Route::patch('/profile', [ProfileController::class, 'update']);
Route::delete('/profile', [ProfileController::class, 'destroy']);
la page de connexion. });
Accéder à l'Utilisateur Connecté

Une fois l'utilisateur authentifié, vous pouvez accéder à ses informations n'importe où dans
votre application via la façade Auth ou l'objet Request .

Dans un Contrôleur : Dans une vue Blade :

use Illuminate\Support\Facades\Auth; <!-- Utiliser la fonction auth() -->


<p>Bonjour, {{ auth()->user()->name }}</p>
public function index(Request $request)
{ <!-- Afficher l'email -->
// Via la façade Auth <p>Votre email : {{ auth()->user()->email }}</p>

$user = Auth::user();
$id = Auth::id();

// Via l'objet Request

$user = $request->user();

// Accéder aux propriétés

echo $user->name;
Vérifier l'État de Connexion

Il est souvent nécessaire d'afficher des éléments différents selon que l'utilisateur est connecté ou non (ex: bouton
"Connexion" vs "Déconnexion").

Dans un Contrôleur : Dans une vue Blade :

if (Auth::check()) { @auth
// L'utilisateur est connecté
<!-- Affiché uniquement si connecté -->
return redirect('/dashboard');
} else { <a href="/dashboard">Mon compte</a>
// L'utilisateur n'est pas connecté
<form method="POST" action="{{ route('logout') }}">
return view('welcome');
} @csrf

<button>Déconnexion</button>

</form>
@endauth

@guest
Introduction à la Validation

Ne faites jamais confiance aux données envoyées par


Le flux de validation Laravel :
envoyées par les utilisateurs !
1. L'utilisateur soumet un formulaire.
La validation est le processus de vérification des
2. Le contrôleur reçoit la requête et applique les règles de
données entrantes pour s'assurer qu'elles
validation.
respectent certaines règles avant de les traiter ou
3. Si valide : L'exécution continue normalement.
de les sauvegarder en base de données.
4. Si invalide : Laravel redirige automatiquement l'utilisateur vers
l'utilisateur vers la page précédente avec les messages d'erreur
d'erreur et les anciennes données en session.
Valider dans le Contrôleur

La méthode la plus simple pour valider des données est d'utiliser la méthode validate()
fournie par l'objet Request .

Exemple dans une méthode store() :

public function store(Request $request)


{
// 1. Valider les données

$validatedData = $request->validate([
'titre' => 'required|string|max:255',
'contenu' => 'required|string',
'email_auteur' => 'required|email|unique:users,email',
]);

// 2. Si la validation passe, le code continue ici

// $validatedData contient uniquement les champs validés


Post::create($validatedData);
Règles de Validation Courantes

Laravel propose des dizaines de règles de validation prêtes à l'emploi.

required string / numeric / boolean


Le champ doit être présent et non vide. Vérifie le type de la donnée.

min:value / max:value email


Longueur min/max (chaînes) ou valeur min/max (nombres). Doit être une adresse email valide.

unique:table,column confirmed
La valeur ne doit pas déjà exister dans la table. Doit correspondre au champ {field}_confirmation .
Afficher les Erreurs de Validation

Si la validation échoue, Laravel redirige l'utilisateur et stocke les erreurs en session. Vous
pouvez les afficher dans vos vues Blade avec la directive @error .

Dans un formulaire Blade :

<div>

<label for="titre">Titre de l'article</label>

<input type="text" name="titre" id="titre">

<!-- Afficher l'erreur spécifique au champ 'titre' -->

@error('titre')
<div class="alert alert-danger">{{ $message }}</div>
Afficher toutes les erreurs en haut du formulaire :
@enderror
</div>
@if ($errors->any())
<div class="alert alert-danger">
Conserver les Anciennes Valeurs

Lorsqu'un formulaire Utilisation de old() :

échoue à la validation,
<!-- Input Text -->
il est très frustrant <input type="text" name="titre"

pour l'utilisateur de value="{{ old('titre') }}">

devoir tout retaper. <!-- Textarea -->


<textarea name="contenu">{{ old('contenu') }}</textarea>

<!-- Checkbox -->


<input type="checkbox" name="actif"

Laravel stocke
{{ old('actif') ? 'checked' : '' }}>

automatiquement
<!-- Select -->
les données <select name="categorie_id">

soumises en
<option value="1" {{ old('categorie_id') == 1 ? 'selected' : '' }}>Tech</option>
session (flash </select>

data). Vous
pouvez les
Form Requests (Validation Avancée)

Pour les formulaires complexes, il est préférable d'extraire la logique de validation du contrôleur vers une classe
dédiée appelée Form Request.

1. Créer la classe : 3. Utiliser dans le contrôleur :

php artisan make:request StorePostRequest // Injecter la classe au lieu de Request


public function store(StorePostRequest $request)

2. Définir les règles : {


// Si on arrive ici, les données sont déjà validées !

class StorePostRequest extends FormRequest {


public function authorize() {
// Récupérer les données validées
return true; // Autoriser l'action
}
$validated = $request->validated();

public function rules() {


Post::create($validated);
return [
'titre' => 'required|max:255',
return redirect('/posts');
'contenu' => 'required',
}
];
}
}
Introduction à l'Upload de Fichiers

La gestion des fichiers uploadés (images de profil,


documents, etc.) est une tâche courante.

Laravel fournit un système de fichiers (Filesystem) Processus d'Upload


puissant basé sur le package Flysystem, qui permet de
1. Formulaire HTML configuré correctement
stocker des fichiers localement ou sur le cloud
2. Validation du fichier (type, taille)
(Amazon S3) avec la même API.
3. Stockage du fichier sur le disque

4. Sauvegarde du chemin en base de données


Configurer le Formulaire HTML

Exemple de formulaire d'upload :


Pour qu'un formulaire HTML
puisse envoyer des fichiers, il
<!-- L'attribut enctype est OBLIGATOIRE -->
doit absolument inclure <form action="/upload" method="POST" enctype="multipart/form-data">

l'attribut
@csrf
enctype="multipart/form-data"
. <div>

Sans cet attribut, seul le nom du <label for="avatar">Image de profil</label>

fichier sera envoyé au serveur, pas le


<!-- Input de type file -->
fichier lui-même !
<input type="file" name="avatar" id="avatar">

</div>

<button type="submit">Uploader</button>
</form>
Traiter l'Upload dans le Contrôleur

Dans le contrôleur, vous pouvez accéder au fichier via l'objet Request, le valider, puis
utiliser la méthode store() pour le sauvegarder.

Exemple complet :

public function store(Request $request)


{
// 1. Valider le fichier (doit être une image, max 2Mo)

$request->validate([
'avatar' => 'required|image|mimes:jpeg,png,jpg,gif|max:2048',
]);

// 2. Vérifier si un fichier a bien été uploadé

if ($request->hasFile('avatar')) {

// 3. Stocker le fichier dans le dossier 'avatars' sur le disque 'public'

// La méthode store() génère un nom unique et retourne le chemin


Le Système de Stockage (Storage)

Utiliser la façade Storage :


Laravel configure ses "disques" de
stockage dans use Illuminate\Support\Facades\Storage;

config/[Link] . // Vérifier si un fichier existe


if (Storage::disk('public')->exists('avatars/[Link]')) {
// ...
.local
Fichiers
: Stocke
privés,dans storage/app/
non accessibles depuis le }

web. // Supprimer un fichier


Storage::disk('public')->delete('avatars/[Link]');

// Télécharger un fichier
return Storage::download('[Link]');

public : Stocke dans


storage/app/public/
. Destiné aux fichiers qui doivent être
accessibles publiquement (images, etc.).

s3 : Stocke sur Amazon S3 (nécessite


Rendre les Fichiers Accessibles

Par défaut, le dossier storage/ n'est pas


accessible depuis le web (pour des raisons
de sécurité).
/public/storage

Pour rendre les fichiers du disque public


accessibles,
lien vous devez créer un
symbolique
/storage/app/public
de public/storage vers
storage/app/public . Cette commande ne doit être exécutée qu'une seule fois par
environnement.

Commande Artisan :

php artisan storage:link


Afficher une Image Uploadée

Une fois le lien symbolique créé, vous pouvez générer l'URL publique de vos fichiers en utilisant
la fonction helper asset() ou la méthode Storage::url() .

Avec la fonction asset() : Avec Storage::url() :

<!-- Si le chemin en BDD est 'avatars/[Link]' --> <!-- Plus robuste si vous changez de disque (ex: S3) -->
<img src="{{ asset('storage/' . $user->avatar_path) }}" <img src="{{ Storage::url($user->avatar_path) }}"

alt="Avatar"> alt="Avatar">

Bonne pratique :

Vérifiez toujours si l'utilisateur a une image avant de l'afficher, sinon affichez une image par défaut.
Les Messages Flash (Session)

Les messages flash sont des données stockées en


session qui ne sont valables que pour la prochaine
requête HTTP.
Votre profil a été mis à jour avec succès
Ils sont parfaits pour afficher des notifications de succès !

succès ou d'erreur après une action (ex: "Article créé


avec succès", "Profil mis à jour").
Créer un Message Flash

La façon la plus courante de créer un message flash est d'utiliser la méthode with() lors
d'une redirection dans votre contrôleur.

Exemples dans un Contrôleur :

public function update(Request $request, $id)


{
// ... logique de mise à jour ...

// Redirection avec un message de succès

return redirect('/profile')->with('success', 'Profil mis à jour !');

// Redirection avec un message d'erreur

return back()->with('error', 'Une erreur est survenue.');

// Redirection avec plusieurs messages


Afficher un Message Flash

Dans vos vues Blade, vous pouvez vérifier si un message flash existe avec
session('clé') et l'afficher.

Dans une vue Blade (souvent dans le layout principal) :

<!-- Message de succès -->


@if (session('success'))
<div class="alert alert-success">

{{ session('success') }}

</div>
@endif

<!-- Message d'erreur -->


@if (session('error'))
<div class="alert alert-danger">

{{ session('error') }}
Projet Pratique : Espace Membre avec Profil

Pour ce module, vous allez créer un espace membre


membre sécurisé où les utilisateurs peuvent s'inscrire, Étapes clés

s'inscrire, se connecter et gérer leur profil. 1. Installer Breeze et migrer la BDD

2. Ajouter une colonne avatar à la table users

Fonctionnalités requises 3. Créer un ProfileController

Installation de Laravel Breeze 4. Créer la vue du formulaire avec


enctype="multipart/form-data"
Page de profil protégée par middleware

Formulaire de mise à jour des infos (avec validation) 5. Gérer la validation (Form Request recommandé)

6. Traiter l'upload et sauvegarder le chemin


Upload d'une image d'avatar
7. Exécuter storage:link et afficher l'avatar
Affichage de messages flash de confirmation

Vous aimerez peut-être aussi