آموزش آپلود تصویر با برنامه نویسی شی گرا با PHP

در این پست آموزش آپلود تصویر با برنامه نویسی شی گرا ، با PHP برایتان قرار داده ایم

برای ظاهر برنامه از یک قالب ساده استفاده شده که درک کدهای CSS آن خیلی راحت می باشد.

برای آپلود فایل با استفاده از برنامه نویسی شی گرا در ابتدا باید کلاس مربوطه را ایجاد کنیم. مادر یک فایل با نام upload_image.php کلاس مورد نظر را نوشتیم که کدهای مورد نظر آن به صورت زیر می باشد.

<?php

class UploadImage
{
    public $filename;
    public $type;
    public $size;
    public $target_path;
    private $temp_path;
    public $upload_dir = "uploads/";
    protected $valid_formats = array("jpg", "JPG", "png", "PNG", "gif", "GIF", "bmp", "BMP");
    public $errors = array();
    protected $upload_errors = array(
        UPLOAD_ERR_OK => "خطایی وجود ندارد",
        UPLOAD_ERR_INI_SIZE => "حجم فایل بیشتر از اندازه تعیین شده می باشد",
        UPLOAD_ERR_FORM_SIZE => "حجم فایل بیشتر از اندازه تعیین شده می باشد",
        UPLOAD_ERR_PARTIAL => "اپلود فایل به صورت جزیی می باشد",
        UPLOAD_ERR_NO_FILE => "شما تصویری را انتخاب نکرده اید",
        UPLOAD_ERR_NO_TMP_DIR => "پوشه ذخیره سازی وجود ندارد",
        UPLOAD_ERR_CANT_WRITE => "مجوز نوشتن بر روی سرور وجود ندارد",
        UPLOAD_ERR_EXTENSION => "آپلود فایل ناموفق می باشد"
    );

    public function attach_file($file, $max_file_size, $width, $height)
    {
        if (!empty($file['name'])) {
            $imageInfo = getimagesize($file["tmp_name"]);
            $imageWidth = $imageInfo[0];
            $imageHeight = $imageInfo[1];
        }
        // در ابتدا چک می کنیم که خطایی در فایل ورودی وجود ندارد
        if (!$file || empty($file) || !is_array($file)) {
            $this->errors[] = "تصویری برای آپلود انتخاب نشده است";
            return false;
        } elseif ($file['error'] != 0) {
            // در صورتی که یک خطایی از خطاهای تعریف شده در بالا پیش آمده باشد
            $this->errors[] = $this->upload_errors[$file['error']];
            return false;
        } elseif (!in_array(pathinfo($file['name'], PATHINFO_EXTENSION), $this->valid_formats)) {
            $this->errors[] = "فرمت تصویر انتخاب شده مجاز نمی باشد";
            return false;
        } elseif ($file['size'] > $max_file_size) {
            $this->errors[] = "حجم تصویر انتخاب شده باید کمتر از 100 کیلوبایت باشد";
            return false;
        } elseif ($file && ($imageHeight > $height || $imageWidth > $width)) {
            $this->errors[] = "اندازه تصویر انتخاب شده باید {$width} در {$height} باشد";
            return false;
        } else {
            // مقادیر مورد نظر را در پروپرتی های کلاس ثبت می کنیم.
            $this->temp_path = $file['tmp_name'];
            $this->filename = basename($file['name']);
            $this->type = $file['type'];
            $this->size = $file['size'];
            return true;
        }
    }

    public function save($uploadDir)
    {

        // در ابتدا پروپرتی error را چک می کنیم که خطایی وجود نداشته باشد
        if (!empty($this->errors)) {
            return false;
        }
        // سپس چک می کنیم که محل موقت فایل و نام فایل وجود دارد یا نه
        if (empty($this->filename) || empty($this->temp_path)) {
            $this->errors[] = "محل فایل در دسترس نمی باشد";
            return false;
        }
        $this->upload_dir = $uploadDir;
        $this->target_path = $this->upload_dir . $this->filename;
        // چک می کنیم که تصویری با این نام وجود دارد یا نه
        if (file_exists($this->target_path)) {
            $this->errors[] = "تصویر انتخاب شده " . " با نام " . $this->filename . " وجود دارد ";
            return false;
        }

        // در این مرحله تصویر مورد نظر را ذخیره می کنیم
        if (move_uploaded_file($this->temp_path, $this->target_path)) {
            // Success

            $this->errors[] = "تصویر با موفقیت آپلود شد";
            return true;
        } else {
            $this->errors[] = "شما مجوز نوشتن  تصویر در پوشه را ندارید";
            return false;
        }
    }
}

نام کلاس مورد نظر UploadImage می باشد. در این کلاس چند ویژگی ( Property ) تعریف کردیم. ویژگی اول filename که نام فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Public می باشد. ویژگی دوم type که پسوند فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Public می باشد. ویژگی سوم size که اندازه فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Public می باشد. ویژگی چهارم target_path که مسیر ذخیره فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Public می باشد. ویژگی پنجم temp_path که مسیر ذخیره موقت فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Private می باشد. ویژگی ششم upload_dir که نام پوشه مورد نظربرای ذخیره تصویر را نگهداری می کند که نوع و حوزه آن Public می باشد. که می توانیم از بیرون کلاس نیز این مسیر را تغییر دهیم. ویژگی هفتم valid_format که فرمت های پیش فرض فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Protected می باشد. ویژگی هشتم errors که خطا ها و پیغام های مورد نظر را نگهداری می کند که باید به کاربر نشان داده شود که نوع و حوزه آن Public می باشد. ویژگی نهم upload_errors که خطاهای پیش آمده هنگام آپلود فایل مورد نظر را نگهداری می کند که نوع و حوزه آن Protected می باشد. که خطاهای مورد نظر را درون آن تعریف کرده ایم.

در این کلاس دو متد تعریف کرده ایم که یک به یک توضیح می دهیم.

متد attach_file :

این متد چند ورودی دارد ورودی اول فایل مورد نظر ، ورودی دوم اندازه فایل مورد نظر ، ورودی سوم عرض تصویر مورد نظر و ورودی چهارم طول تصویر مورد نظر که کاربر به راحتی می تواند در هرجایی که از اپلود استفاده می کند این مقادیر را تغییر دهد.

در ابتدا در داخل if چک می کنیم که نام فایل خالی نباشد سپس با استفاده از تابع getimagesize طول و عرض تصور را بدست می آوریم.

در if بعدی اگر خطایی در فایل ورودی وجود ندارد و اگر خطایی وجود داشته باشد آنها را در ویژگی errors ثیت می کنیم. سپس در دستور بعدی فرمت تصویر مورد نظر را چک می کنیم که یکی از فرمت های تعریف شده باشد. و در دستور بعدی طول و عرض تصویر را چک می کنیم. در نهایت اگر هیچ خطایی وجود نداشت مقادیر مورد نظر را در ویژگی های تعریف شده ثبت می کنیم.

متد save :

در ابتدا چک می کنیم که در ویژگی errors هیچ خطایی ثبت نشده باشد سپس چک می کنیم که نام فایل و محل ذخیره موقت فایل خالی نباشند. سپس چک می کنیم که فایلی با این نام در محل ذخیره سازی وجود نداشته باشد. در نهایت اگر هیچ کدام از این شرطها درست نبود با استفاده از تابع move_uploaded_file تصویر مورد نظر را ذخیره می کنیم.

توضیح کدهای فایل index.php

<html>
<head>
    <meta charset="UTF-8">
    <title>آپلود تصویر</title>
    <link href="style.css" type="text/css" rel="stylesheet">
</head>
<bod>
    <div class="wrapper">
        <div class="header">
            <a href="http://www.iranganj.ir"><img style="margin-top: 20px;margin-right: 30px;" src="logo.png"></a>
        </div>
        <div class="main">
            <div class="sidebar">
                <ul>
                    <li>
                        <a href="index.php">صفحه اصلی</a>
                    </li>
                </ul>
            </div>
            <?php
            function output_message_error($message_error = "")
            {
                if (!empty($message_error)) {
                    $output = "<div style='color: #D8000C;background-color: #FFBABA;text-align: right;'>";
                    $output .= $message_error;
                    $output .= "</div>";
                    return $output;
                } else {
                    return "";
                }
            }

            function output_message_success($message = "")
            {
                if (!empty($message)) {
                    $output = "<div style='color: #4F8A10;background-color: #DFF2BF;text-align: right;'>";
                    $output .= $message;
                    $output .= "</div>";
                    return $output;
                } else {
                    return "";
                }
            }

            $message_error = "";
            $message_success = "";
            if (isset($_POST['submit'])) {
                require_once("upload_image.php");
                $photo = new UploadImage();
                $max_file_size = 102400;
                $width = 200;
                $height = 200;
                $photo->attach_file($_FILES['file_upload'], $max_file_size, $width, $height);
                $uploadDir = "uploads/";
                if ($photo->save($uploadDir)) {
                    $message_success = join("<br/>", $photo->errors);
                    $message_success .= "<br/>" . " نام تصویر :" . $photo->filename . "<br/>";
                    $message_success .= " اندازه تصویر به بایت :" . $photo->size . "<br/>";
                    $message_success .= " مسیر ذخیره تصویر :" . $photo->target_path . "<br/>";
                    $message_success .= " پسوند تصویر :" . $photo->type . "<br/>";
                } else {
                    // Failure
                    $message_error = join("<br />", $photo->errors);
                }
            }
            ?>
            <div class="content">
                <?php
                echo output_message_error($message_error);
                echo output_message_success($message_success);
                ?>
                <form action="index.php" enctype="multipart/form-data" method="post">
                    <div>
                        <span><label>تصویری برای خودتان انتخاب کنید</label></span>
                        <span><label>اندازه تصویر انتخاب شده باید 200 در 200 باشد</label></span>

                        <div>
                            <input type="file" name="file_upload"/>
                        </div>
                    </div>
                    <br/>

                    <div>
                        <div class="buttons">
                            <button type="submit" name="submit">بارگذاری</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="footer">
            <h4 style="text-align: center;padding: 20px;"><a href="http://www.iranganj.ir">تمامی حقوق متعلق به سایت
                    ایران گنج می باشد</a></h4>
        </div>
    </div>
</bod>
</html>

در این فایل ابتدا یک فرم برای آپلود فایل ایجاد می کنیم که در آموزش های قبلی نحوه ایجاد فرم را یاد گرفتیم و فقط در این قسمت به تفاوت هایی که وجود دارد اشاره می کنیم. اولن تفاوت در تگ فرم می باشد که حتما باید ویژگی enctype مورد نظر را باید برابر multipart/form-data قرار دهیم. همچنین یک تگ input داریم که نوع آن file می باشد چون می خواهیم عمل آپلود را انجام دهیم و نام آن نیز file_upload می باشد و یک دکمه نیز درست کردیم.

حال کدهای php  مورد نظر را توضیح می دهیم.

در ابتدا دو تابع تعریف کردیم که خطاها یا پیغام های مورد نظر را نمایش می دهد که نیاز به توضیح خاصی ندارد، همچنین در برنامه های قبلی این مورد را نیز توضیح داده ایم.

در ابتدا چک می کنیم که آیا کاربر بر روی دکمه آپلود کلیک کرده یا نه، اگر کلیک کرده بود فایل upload_image را وارد کردیم چون که می خواهیم از کلاس مربوطه استفاده کنیم. سپس یک نمونه از کلاس مورد نظر با نام photo ایجاد کردیم. در خط بعدی اندازه فایل را مشخص کردیم و در خط بعدی نیز عرض و طول تصویر را مشخص کردیم. سپس متد attach_file از کلاس UploadImage را فراخوانی کردیم و ورودهای مورد نظر را به متد دادیم حال در متد مربوطه که قبلا توضیحات آن را دادیم چک می شود اگر خطایی وجود نداشته باشد به خ بعدی می رویم در خط بعدی محل ذخیره فایل را مشخص کردیم و سپس متد save را فراخوانی کردیم که اگر این متد نیز به درستی عمل کند و تصویر ذخیره شود پیغام های مورد نظر را به کاربر نشان می دهیم و گرنه خطاهای پیش آمده را به کاربر نمایش می دهیم.

توجه : تمامی فایل ها در سورس کد موجود می باشند.