سلام علیرضا تحریری هستم برنامه نویس بک اند که با فریم های Laravel، Livewire، Lumen، Tailwind CSS، Alpine JS و ... کد مینویسم.
آموزش آپلود تصویر در لاراول با نمونه کد
در این پست، قصد دارم در مورد آپلود تصویر در لاراول توضیح دهم.
پس از نصب لاراول، پروژه کد را در ویرایشگر کد باز کنید و مراحل زیر را دنبال کنید.
مرحله - 1
برای کنترل تمام عملیات آپلود تصویر، با اجرای دستور زیر یک کنترلر ایجاد کنید.
php artisan make:controller ImageController
این دستور فایل Controller را در مسیر app\Http\Controllers ایجاد می کند.
حالا کدهای زیر را داخل ImageController قرار دهید.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class ImageController extends Controller
{
// View File To Upload Image
public function index()
{
return view('image-form');
}
// Store Image
public function storeImage(Request $request)
{
$request->validate([
'image' => 'required|image|mimes:png,jpg,jpeg|max:2048'
]);
$imageName = time().'.'.$request->image->extension();
// Public Folder
$request->image->move(public_path('images'), $imageName);
// //Store in Storage Folder
// $request->image->storeAs('images', $imageName);
// // Store in S3
// $request->image->storeAs('images', $imageName, 's3');
//Store IMage in DB
return back()->with('success', 'Image uploaded Successfully!')
->with('image', $imageName);
}
}
مرحله - 2
مرحله بعد، به روزرسانی مسیرهاست. برای به روزرسانی آن، فایل `routes/web.php` را باز کرده و مسیرهای زیر را اضافه کنید.
Route::controller(ImageController::class)->group(function(){
Route::get('/image-upload', 'index')->name('image.form');
Route::post('/upload-image', 'storeImage')->name('image.store');
});
مرحله - 3
حالا زمان ایجاد یک فایل view می باشد؛ وارد مسیر `resources/views` بشوید و یک فایل جدید به نام `image-form.blade.php` ایجاد کنید.
@extends('app')
@section('content')
<!-- Container (Contact Section) -->
<div id="contact" class="container">
<h1 class="text-center" style="margin-top: 100px">Image Upload</h1>
@if ($message = Session::get('success'))
<div class="alert alert-success alert-block">
<strong>{{$message}}</strong>
</div>
<img src="{{ asset('images/'.Session::get('image')) }}" />
@endif
<form method="POST" action="{{ route('image.store') }}" enctype="multipart/form-data">
@csrf
<input type="file" class="form-control" name="image" />
<button type="submit" class="btn btn-sm">Upload</button>
</form>
</div>
@endsection
اگر به مرورگر خود رفته و به /image-upload بروید، گزینه آپلود تصویر را خواهید دید.
هنگامی که تصویری را انتخاب و آپلود کنید، پیام موفقیت آمیز با تصویر را خواهید دید.
امیدوارم که این مقاله مورد استفاده شما قرار گرفته باشد، اگر در حین پیادهسازی با مشکل مواجه شدید، لطفاً سوال خود را در قسمت نظرات مطرح کنید.
منبع: وبسایت میموک
مطلبی دیگر از این انتشارات
آموزش نصب لاراول 10
مطلبی دیگر از این انتشارات
رفع مشکل پلاگین Jalali DateTime Picker (AriaieBOY) در زمان استفاده از فیلتر ها در فیلامنت
مطلبی دیگر از این انتشارات
نکته در FilamentPHP و ترجمه تب ها در Relation Manager