CodeIgniter 4: Как загрузить и изменить размер изображения в CodeIgniter 4

В CodeIgniter 4 уже есть класс Image Manipulation для настройки изображений. С его помощью вы можете изменять размер, качество, поворачивать, обрезать и добавлять водяной знак на изображение.

Он поддерживает GD и библиотеку ImageMagick.

В этом уроке я покажу, как можно загружать и изменять размеры изображения в CodeIgniter 4.

1. Создайте контроллер

Создадим контроллер ImagesController

php spark make:controller ImagesController

Откройте файл app/Controllers/ImagesController.php.

Создайте 2 метода:

• index() - Загрузка представления индекса.
• uploadfile() - Этот метод вызывает <form > submit

Определим проверку файла. Если файл не прошел проверку, вернем на страницу с сообщением об ошибке.

Если файл валидный, загрузим его в папку uploads.

Изменение размера изображения

После загрузки файла изменим размер изображения.

Создадим объект \Config\Services::image(). В $resize_location назначим место хранения файла изображения. Проверим, доступно ли местоположение или нет. Если нет, то создадим его.

$image = \Config\Services::image(); 

$image->withFile('../public/uploads/'.$newName) 
      ->resize(320, 240, true, 'width') 
      ->save('../public/thumbnail/'.$newName);

В функции withFile() передаем путь к загруженному файлу.

В resize() передаются 4 параметра:

• Новая ширина изображения.
• Новая высота изображения.
• Установите значение true, если вы хотите сохранить соотношение сторон изображения.
• По какой оси вы хотите сохранить соотношение сторон. В качестве параметра берется ширина или высота. Если 3-й параметр установлен в false, то 4-й параметр не будет иметь никакого эффекта.

Вызовем save() для сохранения созданного файла.

Готовый код контроллера

<?php

namespace App\Controllers;

use App\Controllers\BaseController;

class ImagesController extends BaseController
{
     public function index(){
          return view('index'); 
     }

     public function uploadfile(){
          $request = service('request');

          ## Validation
          $validation = \Config\Services::validation();

          $input = $validation->setRules([
               'file' => 'uploaded[file]|max_size[file,2048]|ext_in[file,jpeg,jpg,png],'
          ]);

          if ($validation->withRequest($this->request)->run() == FALSE){

               $data['validation'] = $this->validator;
               return redirect()->back()->withInput()->with('validation', $this->validator);

          }else{

               if($file = $this->request->getFile('file')) {
                     if ($file->isValid() && ! $file->hasMoved()) {

                          // Get file name and extension
                          $filename = $file->getName();
                          $ext = $file->getClientExtension();

                          // Get random file name
                          $newName = $file->getRandomName();

                          // Store file in public/uploads/ folder
                          $upload_location = "../public/uploads/";
                          $file->move($upload_location, $newName);

                          // File path to display preview
                          $filepath = base_url()."/uploads/".$newName;

                          // Resize image
                          $resize_location = "../public/thumbnail/";
                          if (!is_dir($resize_location)) {
                                mkdir($resize_location, 0777, TRUE);
                          }

                          $image = \Config\Services::image();
                          $image->withFile($upload_location.$newName)
                                ->resize(320, 240, true, 'width')
                                ->save($resize_location.$newName);

                          // Set Session
                          session()->setFlashdata('message', 'File uploaded successfully.');
                          session()->setFlashdata('alert-class', 'alert-success');

                     }else{
                          // Set Session
                          session()->setFlashdata('message', 'File not uploaded.');
                          session()->setFlashdata('alert-class', 'alert-danger');
                     }
               }else{
                     // Set Session
                     session()->setFlashdata('message', 'File not uploaded.');
                     session()->setFlashdata('alert-class', 'alert-danger');
               }
          }
          return redirect()->route('/');
     }
}

2. Маршруты (Routes)

Откройте файл app/Config/Routes.php.

Определите 2 маршрута:

• / - Отображение формы загрузки.
• image/uploadfile - Загрузить файл.

$routes->get('/', 'ImagesController::index');
$routes->post('image/uploadfile', 'ImagesController::uploadfile');

3. Создайте вид/представление

Создайте файл index.php в папке app/Views/.

Выведите уведомление bootstrap, если установлен SESSION.

Создайте <form> и установите его action на site_url('image/uploadfile'). В <form> создайте элемент file и кнопку submit.

Готовый код

<!DOCTYPE html>
<html>
<head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Как загрузить и изменить размер изображения в CodeIgniter 4</title>

     <!-- Bootstrap CSS -->
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" >
</head>
<body>

     <div class="container">

          <div class="row">
                <div class="col-md-6 mt-5" style="margin: 0 auto;">

                    <?php 
                    // Display Response
                    if(session()->has('message')){      
                    ?>
                         <div class="alert <?= session()->getFlashdata('alert-class') ?>">
                              <?= session()->getFlashdata('message') ?>
                         </div>
                    <?php
                    }
                    ?>

                    <?php $validation = \Config\Services::validation(); ?>

                    <form method="post" action="<?=site_url('image/uploadfile')?>" enctype="multipart/form-data">

                         <?= csrf_field(); ?>

                         <div class="form-group mb-4">
                              <label class="control-label col-sm-2" for="file">File:</label>
                              <div class="col-sm-10">
                                    <input type="file" class="form-control" id="file" name="file" >
                              </div>

                              <!-- Error -->
                              <?php if( $validation->getError('file') ) {?>
                                    <div class='text-danger mt-2'>
                                         * <?= $validation->getError('file'); ?>
                                    </div>
                              <?php }?>
                         </div>

                         <div class="form-group "> 
                              <div class="col-sm-offset-2 col-sm-10">
                                    <button type="submit" class="btn btn-info">Submit</button>
                              </div>
                         </div>
                    </form>
                </div>
          </div>

     </div>
</body>
</html>

Результат:

 

Для примера я сохранил файл изображения с измененным размером в другом месте, но вы можете заменить существующий файл, если хотите.