Feb 23, 2023
.
Admin
Hi friends,
This article will provide example of laravel 10 multiple files upload step by step. let’s discuss about uploading a multiple files in laravel 10 with validation. We will use laravel 10 upload multiple files and display the message validation. I’m going to show you about upload multiple files in laravel 10 into the database and storage directory with validation. Alright, let’s dive into the steps.
This file upload in the tutorial will create a multiple files uploaded form in laravel 10 with validation, which is used to store files in the database and storage directory.
Let's start following example:
Step 1: Download Laravel
Let us begin the tutorial by installing a new laravel application. if you have already created the project, then skip following step.
composer create-project laravel/laravel example-app
Step 2 : Add Controller
In this step, we will create a new MultipleFileUploadController; in this file, we will add two methods index() and store() for render view and store file logic.
Let's create MultipleFileUploadController by following command:
php artisan make:controller MultipleFileUploadController
app/Http/Controllers/MultipleFileUploadController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class MultipleFileUploadController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
return view('mltipleFileUpload');
}
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
$request->validate([
'files' => 'required',
'files.*' => 'required|mimes:pdf,xlx,csv|max:2048',
]);
$files = [];
if ($request->file('files')){
foreach($request->file('files') as $key => $file)
{
$fileName = time().rand(1,1010).'.'.$file->extension();
$file->move(public_path('uploads'), $fileName);
$files[]['name'] = $fileName;
}
}
foreach ($files as $key => $file) {
Image::create($file);
}
return back()
->with('success','You have successfully upload file.');
}
}
Store File in Storage Folder
$request->file->storeAs('uploads', $fileName);
// storage/app/uploads/file.png
Store File in Public Folder
$request->file->move(public_path('uploads'), $fileName);
// public/uploads/file.png
Store File in S3
$request->file->storeAs('uploads', $fileName, 's3');
Step 3 : Add Routes
routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\MultipleFileUploadController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group that
| contains the "web" middleware group. Now create something great!
|
*/
Route::controller(MultipleFileUploadController::class)->group(function(){
Route::get('multiple-file-upload', 'index');
Route::post('multiple-file-upload', 'store')->name('file.store');
});
Step 4: Add Blade File
resources/views/multipleFileUpload.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel 10 Multiple File Upload Step by Step Example - Nicesnippets.com</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="panel panel-primary">
<div class="panel-heading text-center mt-5">
<h2>Laravel 10 Multiple File Upload Step by Step Example - Nicesnippets.com</h2>
</div>
<div class="panel-body mt-5">
@if ($message = Session::get('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
<strong>{{ $message }}</strong>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
<form action="{{ route('file.store') }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="mb-3">
<label class="form-label" for="inputImage">Select Images:</label>
<input
type="file"
name="files[]"
id="inputImage"
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">Upload</button>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Run Laravel App:
All steps have been done, now you have to type the given command and hit enter to run the laravel app:
php artisan serve
Now, you have to open web browser, type the given URL and view the app output:
http://localhost:8000/multiple-file-upload
Output:
I hope it can help you...
#Laravel 10
