Nous allons apprendre étape par étape à effectuer un téléchargement multiple de fichiers dans une application Laravel
Dans cet exemple, nous allons créer une table “files” avec une colonne “name”. Ensuite, nous concevrons une page web simple où les utilisateurs pourront sélectionner plusieurs fichiers à télécharger. Ces fichiers seront enregistrés à la fois dans le dossier “uploads” et dans la base de données.
Table des matières :
Étapes pour le téléchargement multiple de fichiers avec Laravel 11
Installer Laravel 11
Créer une migration et un modèle
Créer un contrôleur
Créer des routes
Créer un fichier Blade
Étape 1 : Installer Laravel 11
composer create-project laravel/laravel example-app
Étape 2 : Créer une migration et un modèle
Créez une migration pour la table “files” en exécutant la commande suivante :
php artisan make:migration create_files_table
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('files', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('files');
}
};
Ensuite, exécutez la migration :
php artisan migrate
Créez un modèle nommé File pour gérer les données des fichiers :
php artisan make:model File
// app/Models/File.php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class File extends Model
{
use HasFactory;
protected $fillable = [
'name'
];
}
Étape 3 : Créer un contrôleur
Créez un nouveau contrôleur nommé FileController. Ce contrôleur contiendra deux méthodes :
index() pour afficher le formulaire.
store() pour gérer la logique de téléchargement des fichiers dans le dossier public et dans la base de données.
php artisan make:controller FileController
Ajoutez la logique nécessaire pour valider et traiter plusieurs fichiers téléchargés.
// app/Http/Controllers/FileController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\View\View;
use Illuminate\Http\RedirectResponse;
use App\Models\File;
class FileController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index(): View
{
return view('fileUpload');
}
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function store(Request $request): RedirectResponse
{
// Validate incoming request data
$request->validate([
'files' => 'required|array',
'files.*' => 'required|mimes:pdf,xlx,csv|max:2048',
]);
// Initialize an array to store file information
$files = [];
// Process each uploaded file
foreach($request->file('files') as $file) {
// Generate a unique name for the file
$fileName = time() . '_' . uniqid() . '.' . $file->getClientOriginalExtension();
// Move the file to the desired location
$file->move(public_path('uploads'), $fileName);
// Add file information to the array
$files[] = ['name' => $fileName];
}
// Store files in the database using create method
foreach ($files as $fileData) {
File::create($fileData);
}
return back()->with('success', 'Files uploaded successfully!')
->with('files', $files);
}
}
// Store Files in Storage Folder
$file->storeAs('files', $fileName);
// storage/app/files/file.png
// Store Files in Public Folder
$file->move(public_path('files'), $fileName);
// public/files/file.png
// Store Files in S3
$file->storeAs('files', $fileName, 's3');
Étape 4 : Créer des routes
Ajoutez des routes dans le fichier routes/web.php pour gérer les requêtes GET et POST :
// routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\FileController;
Route::get('file-upload', [FileController::class, 'index']);
Route::post('file-upload', [FileController::class, 'store'])->name('file.store');
Étape 5 : Créer un fichier Blade
Créez un fichier nommé fileUpload.blade.php dans le dossier resources/views. Ce fichier contiendra un formulaire avec une option pour sélectionner plusieurs fichiers à télécharger.
// resources/views/fileUpload.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel 11 Multiple File Upload Example - ItSolutionStuff.com</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
</head>
<body>
<div class="container">
<div class="card mt-5">
<h3 class="card-header p-3"><i class="fa fa-star"></i> Laravel 11 Multiple File Upload Example - ItSolutionStuff.com</h3>
<div class="card-body">
@session('success')
<div class="alert alert-success" role="alert">
{{ $value }}
</div>
@endsession
<form action="{{ route('file.store') }}" method="POST" enctype="multipart/form-data" class="mt-2">
@csrf
<div class="mb-3">
<label class="form-label" for="inputFile">Select Files:</label>
<input
type="file"
name="files[]"
id="inputFile"
multiple
class="form-control @error('files') is-invalid @enderror">
@error('files')
<span class="text-danger">{{ $message }}</span>
@enderror
</div>
<div class="mb-3">
<button type="submit" class="btn btn-success"><i class="fa fa-save"></i> Upload</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Une fois toutes les étapes nécessaires terminées, lancez l’application Laravel avec la commande suivante :
php artisan serve
Ensuite, ouvrez votre navigateur web, entrez l’URL suivante et visualisez le résultat de l’application :
http://localhost:8000/file-upload
Vous pourrez télécharger plusieurs fichiers et voir la confirmation ainsi que les fichiers enregistrés.
