在未開啟GD 擴展的環境下模擬imageflip() 功能

M66 2025-05-18

在PHP 中， imageflip()是一個用於圖像翻轉的方便函數，但前提是你必須開啟GD 擴展。對於一些受限環境或出於安全、性能考慮未啟用GD 擴展的服務器，我們仍可以通過其他方式來模擬該功能。本文將介紹如何在不依賴GD 擴展的前提下，使用純PHP 實現類似imageflip()的圖像翻轉功能。

一、前提與思路

我們以常見的圖像格式如PNG 或JPEG 為例，目標是模擬出圖像的垂直翻轉（上下翻轉）或水平翻轉（左右翻轉）功能。既然不能使用GD 函數，就只能直接對圖像的數據進行操作。一個可行的辦法是將圖像轉換為像素數組進行處理，推薦使用以下幾種方法：

使用imagecreatefromstring() （需GD）
使用Imagick擴展（替代方案，但仍為擴展）
純PHP 解析圖像數據（性能較低，但完全無擴展）

本文將展示一種利用base64 數據URI 的方式，將圖像加載為HTML5 Canvas，再通過PHP 模擬類似處理。

二、通過瀏覽器配合服務端實現圖像翻轉

雖然PHP 端無法直接操作像素數據，但我們可以將圖像上傳後，利用HTML 和JavaScript 在客戶端做翻轉，然後再上傳處理後的圖像。

示例HTML（配合後端使用）

 <!DOCTYPE html>
<html>
<head>
    <title>圖像翻轉工具</title>
</head>
<body>
    <h1>圖像翻轉</h1>
    <input type="file" id="upload" accept="image/*">
    <button onclick="flipImage('horizontal')">水平翻轉</button>
    <button onclick="flipImage('vertical')">垂直翻轉</button>
    <canvas id="canvas" style="display:none;"></canvas>
    <form method="POST" action="https://m66.net/receive_image.php" enctype="multipart/form-data">
        <input type="hidden" name="flippedImage" id="flippedImage">
        <button type="submit">上傳翻轉後圖像</button>
    </form>

    <script>
        const upload = document.getElementById('upload');
        const canvas = document.getElementById('canvas');
        const ctx = canvas.getContext('2d');

        let img = new Image();

        upload.addEventListener('change', function(e) {
            const file = e.target.files[0];
            const reader = new FileReader();
            reader.onload = function(event) {
                img.onload = function() {
                    canvas.width = img.width;
                    canvas.height = img.height;
                    ctx.drawImage(img, 0, 0);
                }
                img.src = event.target.result;
            }
            reader.readAsDataURL(file);
        });

        function flipImage(direction) {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.save();
            if (direction === 'horizontal') {
                ctx.scale(-1, 1);
                ctx.drawImage(img, -canvas.width, 0);
            } else {
                ctx.scale(1, -1);
                ctx.drawImage(img, 0, -canvas.height);
            }
            ctx.restore();
            document.getElementById('flippedImage').value = canvas.toDataURL("image/png");
        }
    </script>
</body>
</html>

PHP 接收端：receive_image.php

 <?php
if (isset($_POST['flippedImage'])) {
    $data = $_POST['flippedImage'];

    if (preg_match('/^data:image\/(\w+);base64,/', $data, $type)) {
        $data = substr($data, strpos($data, ',') + 1);
        $type = strtolower($type[1]); // jpg, png, gif

        if (!in_array($type, ['jpg', 'jpeg', 'png'])) {
            throw new Exception('不支持的圖像類型');
        }

        $data = base64_decode($data);

        if ($data === false) {
            throw new Exception('base64 解碼失敗');
        }
    } else {
        throw new Exception('無效的圖像數據');
    }

    $fileName = 'flipped_' . uniqid() . '.' . $type;
    file_put_contents(__DIR__ . '/' . $fileName, $data);

    echo "圖像上傳並保存成功: <a href=\"https://m66.net/$fileName\">點擊查看</a>";
} else {
    echo "未接收到圖像數據。";
}
?>

三、總結

雖然在未開啟GD 擴展的情況下直接用PHP 實現像imageflip()的操作比較困難，但我們可以結合前端技術實現圖像翻轉，並將翻轉後的圖像提交給服務端保存。這種方式雖然繞了一點，但能有效規避PHP 端的擴展依賴問題，非常適合輕量級部署場景。