آموزش آپلود تصویر در لاراول با نمونه کد

در این پست، قصد دارم در مورد آپلود تصویر در لاراول توضیح دهم.

پس از نصب لاراول، پروژه کد را در ویرایشگر کد باز کنید و مراحل زیر را دنبال کنید.

مرحله - 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 بروید، گزینه آپلود تصویر را خواهید دید و هنگامی که تصویری را انتخاب و آپلود کنید، پیام موفقیت آمیز با تصویر را خواهید دید.

امیدوارم که این مقاله مورد استفاده شما قرار گرفته باشد، اگر در حین پیاده‌سازی با مشکل مواجه شدید، لطفاً سوال خود را در قسمت نظرات مطرح کنید.

منبع: dev.to