Конвертація зображень в формат WebP за допомогою PHP та бібліотеки GD

WebP – це сучасний формат стиснутих зображень, який запровадила компанія Google ще в далекому 2010 році. Але тільки зараз цей формат стає стандартом для використання майже на всіх сайтах. Адже ущільнені картинки цього формату збільшують продуктивність і швидкість завантаження сторінок сайту в декілька разів.

В цьому матеріалі, я покажу вам, як за допомогою PHP можна реалізувати конвертацію картинок з формату JPG, або PNG в формат WebP.

Конвертація JPG або PNG в WebP

<?php
// Вказуємо шлях до вхідного файлу (наприклад, JPEG або PNG)
$inputFilePath = 'шлях_до_вашої_картинки.jpg';

// Вказуємо шлях до вихідного файлу WebP
$outputFilePath = 'шлях_до_вашої_картинки.webp';

// Отримуємо ресурс зображення
$image = imagecreatefromjpeg($inputFilePath); // для JPEG
// або
// $image = imagecreatefrompng($inputFilePath); // для PNG

// Зберігаємо зображення у форматі WebP
imagewebp($image, $outputFilePath);

// Звільняємо ресурси
imagedestroy($image);
?>

Мінус цього коду в тому, що тут ви можете вказати і конвертувати зображення тільки одного якогось формату: JPG, або PNG.

Тому краще зробити так, щоб можна було виконувати конвертацію файлів зображень любого формату.

Конвертація зображень в формат WebP на PHP

<?php
// Шлях до вхідного файлу
$inputFileName = '1.bmp';

// Шлях до вихідного файлу WebP
$outputFileName = '2.webp';

// Отримання типу зображення
$inputFilePath = 'шлях_до_вашої_папки' . DIRECTORY_SEPARATOR . $inputFileName;

// Зчитування вмісту файлу в рядок
$imageData = file_get_contents($inputFilePath);

// Отримання типу зображення на основі даних з рядка
$imageType = exif_imagetype($inputFilePath);

// Перевірка чи є файл картинкою
if (!$imageType) {
    die('Файл не є підтримуваним зображенням.');
}

// Отримати ресурс зображення
$image = imagecreatefromstring($imageData);

// Зберегти зображення у форматі WebP
imagewebp($image, $outputFileName);

// Звільнити ресурси
imagedestroy($image);
?>

Цей код дозволяє конвертувати файли будь-якого підтримуваного формату в формат WebP. Він зчитує вміст файлу в рядок, отримує тип зображення і використовує imagecreatefromstring для створення ресурсу зображення без прив'язки до конкретного формату файлу.

Зверніть увагу на те, що в даному коді, ви обов'язково повинні вказати шлях до папки з вхідним та вихідним файлом.

Пакетна обробка картинок

Якщо у вас дуже багато картинок, то цілком логічно, що краще написати програму, яка буде обробляти всі картинки які є у зазначеній вами папці. Ось приклад коду, який допоможе реалізувати подібну обробку картинок.

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['images']['tmp_name'][0])) {
    // Отримання списку вибраних файлів
    $inputFilePaths = $_FILES['images']['tmp_name'];

    // Шлях до вихідної папки WebP
    $outputFolder = 'output_folder/';

    // Перевірка існування вихідної папки
    if (!file_exists($outputFolder)) {
        mkdir($outputFolder, 0777, true);
    }

    foreach ($inputFilePaths as $index => $inputFilePath) {
        // Перевірка наявності вхідного файлу
        if (!file_exists($inputFilePath)) {
            echo 'Помилка: Файл ' . $_FILES['images']['name'][$index] . ' не знайдено.<br>';
            continue;
        }

        // Отримання розширення файлу
        $extension = pathinfo($_FILES['images']['name'][$index], PATHINFO_EXTENSION);

        // Перевірка чи є файл картинкою за допомогою exif_imagetype
        $imageType = exif_imagetype($inputFilePath);
        if (!$imageType || !in_array($imageType, [IMAGETYPE_JPEG, IMAGETYPE_PNG], true)) {
            echo 'Файл ' . $_FILES['images']['name'][$index] . ' не є підтримуваним зображенням і тому його не було опрацьовано.<br>';
            continue;
        }

        // Отримання ресурсу зображення
        switch ($imageType) {
            case IMAGETYPE_JPEG:
                $image = imagecreatefromjpeg($inputFilePath);
                break;
            case IMAGETYPE_PNG:
                $image = imagecreatefrompng($inputFilePath);
                break;
            // Можливо, вам потрібно додати інші формати зображень, якщо вони використовуються
            default:
                echo 'Непідтримуваний формат зображення для файлу ' . $_FILES['images']['name'][$index] . '.<br>';
                continue 2; // Пропустити до наступної ітерації зовнішнього циклу
        }

        // Перевірка успішності створення ресурсу зображення
        if (!$image) {
            echo 'Помилка: Неможливо створити ресурс зображення для файлу ' . $_FILES['images']['name'][$index] . '.<br>';
            continue;
        }

        // Збереження зображення у форматі WebP
        $outputFilePath = $outputFolder . pathinfo($_FILES['images']['name'][$index], PATHINFO_FILENAME) . '.webp';
        if (!imagewebp($image, $outputFilePath)) {
            echo 'Помилка: Неможливо зберегти зображення у форматі WebP для файлу ' . $_FILES['images']['name'][$index] . '.<br>';
            continue;
        }

        // Звільнення ресурсів
        imagedestroy($image);

        echo 'Файл ' . $_FILES['images']['name'][$index] . ' успішно конвертовано в ' . $outputFilePath . '.<br>';
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Завантажити та конвертувати</title>
</head>
<body>

<!-- Форма для завантаження файла або папки -->
<form method="post" enctype="multipart/form-data">
    <input type="file" name="images[]" accept="image/*" multiple="multiple" webkitdirectory directory>
    <button type="submit">Завантажити та конвертувати</button>
</form>

</body>
</html>

Мультивибір картинок для конвертації

Багаторазовий вибір картинок дозволяє опрацювати не всі картинки в заданому каталозі, а тільки декілька картинок які вказує користувач.

<?php
// Перевірка, чи були відправлені файли
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['images']) && is_array($_FILES['images']['tmp_name'])) {
    // Шлях до вихідної папки WebP
    $outputFolder = 'output_folder/';

    // Перевірка існування вихідної папки
    if (!file_exists($outputFolder)) {
        mkdir($outputFolder, 0777, true);
    }

    foreach ($_FILES['images']['tmp_name'] as $index => $inputFilePath) {
        // Перевірка наявності вхідного файлу
        if (!file_exists($inputFilePath)) {
            echo 'Помилка: Файл ' . $_FILES['images']['name'][$index] . ' не знайдено.<br>';
            continue;
        }

        // Отримання ресурсу зображення
        $image = imagecreatefromstring(file_get_contents($inputFilePath));

        // Перевірка успішності створення ресурсу зображення
        if (!$image) {
            echo 'Помилка: Неможливо створити ресурс зображення для файлу ' . $_FILES['images']['name'][$index] . '.<br>';
            continue;
        }

        // Збереження зображення у форматі WebP
        $outputFilePath = $outputFolder . pathinfo($_FILES['images']['name'][$index], PATHINFO_FILENAME) . '.webp';
        if (!imagewebp($image, $outputFilePath)) {
            echo 'Помилка: Неможливо зберегти зображення у форматі WebP для файлу ' . $_FILES['images']['name'][$index] . '.<br>';
            continue;
        }

        // Звільнення ресурсів
        imagedestroy($image);

        echo 'Файл ' . $_FILES['images']['name'][$index] . ' успішно конвертовано в ' . $outputFilePath . '.<br>';
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Завантажити та конвертувати</title>
</head>
<body>

<!-- Форма для завантаження файлів -->
<form method="post" enctype="multipart/form-data">
    <input type="file" name="images[]" accept="image/*" multiple="multiple">
    <button type="submit">Завантажити та конвертувати</button>
</form>

</body>
</html>