Téléchargement de plusieurs fichiers avec Laravel

Initialisation

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.

É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.

par