Saya akan menjelaskan kepada Anda tutorial langkah demi langkah mengubah ukuran gambar dalam aplikasi laravel 7/6 menggunakan Intervention Image. kita akan belajar bagaimana menggunakan paket intervensi gambar dengan laravel 7/6. kami akan menghasilkan gambar thumbnail saat diunggah di laravel 7/6.

kami akan menggunakan intervention/image package untuk mengubah ukuran atau mengubah ukuran gambar di laravel. Intervensi menyediakan fungsi ukuran yang akan mengambil tiga parameter. tiga parameter adalah fungsi lebar, tinggi dan panggilan balik. fungsi panggilan balik adalah opsional.

Jadi di sini saya menulis tutorial langkah demi langkah tentang mengubah ukuran gambar di laravel. Jadi ikuti saja langkah di bawah ini untuk membuat contoh gambar untuk proyek Anda.

Langkah 1: Instal Laravel 7/6

Pada langkah ini, jika Anda belum menginstal aplikasi laravel 6 maka kita harus mendapatkan aplikasi laravel 6 yang baru. Jadi jalankan perintah di bawah ini dan dapatkan aplikasi laravel 6 yang bersih dan segar.

composer create-project --prefer-dist laravel/laravel blog

Langkah 2: Install Intervention Image Package

Pada langkah kedua kita akan menginstal intervention/image untuk mengubah ukuran gambar. paket ini melalui kami dapat menghasilkan gambar thumbnail untuk proyek kami. jadi pertama jalankan perintah di bawah ini di cmd atau terminal Anda:

composer require intervention/image

Sekarang kita perlu menambahkan path provider dan alias path di file config/app.php jadi buka file itu dan tambahkan kode di bawah ini.

config/app.php

return [
    ......
    $provides => [
        ......
        ......,
        'Intervention\Image\ImageServiceProvider'
    ],

    $aliases => [
        .....
        .....,
        'Image' => 'Intervention\Image\Facades\Image'
    ]
]

Langkah 3: Create Routes

Pada langkah ini kita akan menambahkan route dan file controller jadi pertama tambahkan route di bawah ini di file routes.php Anda.

routes/web.php

Route::get('resizeImage', 'ImageController@resizeImage');
Route::post('resizeImagePost', 'ImageController@resizeImagePost')->name('resizeImagePost');

Langkah 4: Create Controller File

Sekarang perlu membuat ImageController baru untuk mengunggah gambar dan mengubah ukuran gambar jadi pertama jalankan perintah di bawah ini:

php artisan make:controller ImageController

Setelah perintah ini, Anda dapat menemukan file ImageController.php di direktori app/Http/Controllers Anda. buka file ImageController.php dan letakkan kode di bawah dalam file itu.

app/Http/Controllers/ImageController.php

<?php
  
namespace App\Http\Controllers;
   
use Illuminate\Http\Request;
use App\Http\Requests;
use Image;
class ImageController extends Controller
{
  
    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function resizeImage()
    {
        return view('resizeImage');
    }
  
    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function resizeImagePost(Request $request)
    {
        $this->validate($request, [
            'title' => 'required',
            'image' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
        ]);
  
        $image = $request->file('image');
        $input['imagename'] = time().'.'.$image->extension();
     
        $destinationPath = public_path('/thumbnail');
        $img = Image::make($image->path());
        $img->resize(100, 100, function ($constraint) {
            $constraint->aspectRatio();
        })->save($destinationPath.'/'.$input['imagename']);
   
        $destinationPath = public_path('/images');
        $image->move($destinationPath, $input['imagename']);
   
        return back()
            ->with('success','Image Upload successful')
            ->with('imageName',$input['imagename']);
    }
   
}

Langkah 5: View File and Create Upload directory

Ok, pada langkah terakhir ini kita akan membuat file resizeImage.blade.php untuk form unggah foto dan mengelola pesan kesalahan dan juga pesan sukses. Jadi pertama-tama buat file resizeImage.blade.php dan letakkan kode di bawah ini:

resources/views/resizeImage.blade.php

@extends('layouts.app')
   
@section('content')
<div class="container">
<h1>Resize Image Uploading Demo</h1>
@if (count($errors) > 0)
    <div class="alert alert-danger">
        <strong>Whoops!</strong> There were some problems with your input.<br><br>
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
   
@if ($message = Session::get('success'))
<div class="alert alert-success alert-block">
    <button type="button" class="close" data-dismiss="alert">×</button>    
    <strong>{{ $message }}</strong>
</div>
<div class="row">
    <div class="col-md-4">
        <strong>Original Image:</strong>
        <br/>
        <img src="/images/{{ Session::get('imageName') }}" />
    </div>
    <div class="col-md-4">
        <strong>Thumbnail Image:</strong>
        <br/>
        <img src="/thumbnail/{{ Session::get('imageName') }}" />
    </div>
</div>
@endif
   
{!! Form::open(array('route' => 'resizeImagePost','enctype' => 'multipart/form-data')) !!}
    <div class="row">
        <div class="col-md-4">
            <br/>
            {!! Form::text('title', null,array('class' => 'form-control','placeholder'=>'Add Title')) !!}
        </div>
        <div class="col-md-12">
            <br/>
            {!! Form::file('image', array('class' => 'image')) !!}
        </div>
        <div class="col-md-12">
            <br/>
            <button type="submit" class="btn btn-success">Upload Image</button>
        </div>
    </div>
{!! Form::close() !!}
</div>
@endsection

Ok, akhirnya buat dua direktori di folder publik Anda (1) gambar dan (2) thumbnail dan tolong beri izin ke folder itu dan periksa ....

Saya harap ini dapat membantu Anda ...