圖像上傳在服務器之前調整PHP大小

Question

對於這個問題的任何幫助，我將非常感謝。 我有一個基於joomla的網站，並使用第三方擴展程序，我試圖使訪問者能夠上傳包括照片在內的信息。 但是， 在上傳到服務器之前 ，我需要實現一些PHP代碼來調整圖像大小，以減少上傳時間和上傳失敗。 該網站的開發人員放置了“調整大小”，但這僅在到達服務器后才調整圖像大小。

// Resize Params Hack
                $OriginalfileWidth = getimagesize($file);
                $NewFileWidth = 400; // Set here the new desired width

                if ($OriginalfileWidth[0] > $NewFileWidth) {
                    $this->resize($NewFileWidth, $file, $ext);
                }

            }
        }


    }

    protected function resize($newWidth, $targetFile, $ext) {

        $targetFile = JPATH_ROOT . '/' . $targetFile;

        if (empty($newWidth) || empty($targetFile)) {
            return false;
        }

        switch ($ext) {
            case 'jpg':
            $src = imagecreatefromjpeg($targetFile);
            break;
            case 'gif':
            $src = ImageCreateFromGif($targetFile);
            break;
            case 'png':
            $src = ImageCreateFrompng($targetFile);
            break;
        }

        list($width, $height) = getimagesize($targetFile);
        $newHeight = ($height / $width) * $newWidth;
        $tmp = imagecreatetruecolor($newWidth, $newHeight);
        imagecopyresampled($tmp, $src, 0, 0, 0, 0, $newWidth, $newHeight, $width, $height);
        if (file_exists($targetFile)) {
            unlink($targetFile);
        }

        switch ($ext) {
            case 'jpg':
            imagejpeg($tmp, $targetFile, 85); // 85 is my choice, make it between 0 – 100 for output image quality with 100 being the most luxurious
            break;
            case 'gif':
            imagegif($tmp, $targetFile);
            break;
            case 'png':
            imagepng($tmp, $targetFile, 8);
            break;
        }

    }

}

我已經注意到有關搜索stackoverflow的代碼，但是我根本不知道如何輸入它。 非常感謝您的幫助。 馬修

Answer 1

使用swfupload：

http://code.google.com/p/swfupload/

有關如何在此處調整大小的演示：

http://demo.swfupload.org/v250beta3/resizedemo/index.php

在使用Flash上​​傳圖片之前，這會先調整圖片大小。

Answer 2

如果要在上載到服務器之前調整圖像大小，則必須使用畫布。 我正在使用以下代碼。 我會為您提供幫助。

的HTML

<input id="imageFile" type="file"><input type="button" value="Resize Image"  onclick="ResizeImage()"/> 
<img src="" id="image_output">

Java腳本

function ResizeImage() {
    var filesToUpload = document.getElementById('imageFile').files;
    var file = filesToUpload[0];

    // Create an image
    var img = document.createElement("img");
    // Create a file reader
    var reader = new FileReader();
    // Set the image once loaded into file reader
    reader.onload = function(e) {
            img.src = e.target.result;

            var canvas = document.createElement("canvas");
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0);

            var MAX_WIDTH = 400;
            var MAX_HEIGHT = 400;
            var width = img.width;
            var height = img.height;

            if (width > height) {
                if (width > MAX_WIDTH) {
                    height *= MAX_WIDTH / width;
                    width = MAX_WIDTH;
                }
            } else {
                if (height > MAX_HEIGHT) {
                    width *= MAX_HEIGHT / height;
                    height = MAX_HEIGHT;
                }
            }
            canvas.width = width;
            canvas.height = height;
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0, width, height);

            var dataurl = canvas.toDataURL("image/png");
            document.getElementById('image_output').src = dataurl;
        }
    reader.readAsDataURL(file);
}