ورود

View Full Version : آموزش ساخت فرم آپلود فایل ساده با html و php



davood_net
یک شنبه 25 فروردین 1392, 09:01 صبح
اینم به درخواست یکی از بچه ها آموزش ساخت فرم آپلود فایل ساده با html و php . برای اینکار ما به دو صفحه احتیاج داریم ،یک صفحه HTML که فرم رو نمایش بدیم و یک صفحه PHP تا اطلاعات فایل ارسالی رو بررسی و عمل آپلود رو انجام بده و اگر خواستید محدودیتی از نظر نوع فایل (فرمت فایل) و یا حجم فایل برای آپلود ایجاد کنید باید در همین صفحه PHP اون رو اعمال کنید که در آموزش های بعدی این محدودیت ها رو برای ساخت فرم آپلود بررسی خواهیم کرد.

مرحله ۱ : صفحه ی HTML

خوب ما از صفحه HTML شروع می کنیم :

<form enctype=”multipart/form-data” action=”uploader.php” method=”post” >
<input name=”MAX_FILE_SIZE” value=”100000″ type=”hidden” />
<label>فایل پیوست را انتخاب نمایید:</label>
<input type=”file” name=”UploadedFile” />
<input type=”submit” value=”آپلود” />
</form>



خوب حالا ببینیم این کدهایی که گفتیم چه هستند و چکار میکنند!

همونطور که میدونید برای ایجاد کردن یک فرم از تگ <form> استفاده میکنیم.تگ فرم دارای خصوصیاتی است که بعضیهاش اختیاری هستند و بعضی هاش اجباری. در زیر ما این خصوصیات رو بررسی خواهیم کرد:

<form enctype=”multipart/form-data” action=”uploader.php” method=”post” >
این مشخصه که به صورت توپر مشخص کردیم به مرورگر اعلام میکنه که این فرم برای انتقال و آپلود فایل مورد استفاده قرار میگیره به صورتی که در فرم های معمولی که برای آپلود نیستند به این مشخصه نیازی نخواهیم داشت.
<form enctype=”multipart/form-data” action=”uploader.php” method=”post” >
مشخصه ی بعدی محل فایل php رو نشون میده ، این فایل php همون صفحه ایست که مشخصات فایل رو بررسی میکنه و فایل آپلودی رو ذخیره میکنه.نام این صفحه در اینجا uploader.php است اگر نام صفحه ی php شما فرق میکنه یادتون باشه در این بخش نام فایل php خودتون رو وارد کنید. شما میتونید از آدرس دهی نسبی و یا مطلق برای مقدار این مشخصه استفاده کنید یعنی :
action=”http://www.YOURSITE.com/uploader.php”
و یا اگر به صورت نسبی خواستید که مثل کدی که به رنگ بنفش هست استفاده میکنید.(در صورتی که در مفهوم آدرس دهی نسبی و مطلق مشکلی دارید میتونید به این مطلب (http://www.asreelm.com/html-lesson6/) و بخش آدرس دهی مراجعه کنید).

<form enctype=”multipart/form-data” action=”uploader.php” method=”post” >
این مشخصه نحوه ی ارسال اطلاعات رو نشون میده. در کل دو شیوه برای ارسال و دریافت اطلاعات وجود دارند که post و get نامیده میشوند.ما برای فرم های آپلود از متد post استفاده میکنیم.
خوب حالاکه مشخصات اصلی فرم رو تعیین کردیم ، باید یک فیلد ایجاد کنیم تا کاربر بتونه از طریق اون فایل رو برای ما ارسال کنه. ولی قبل از اون من برای محکم کاری! یک فیلد مخفی (hidden) هم قرار دادم و در اون تعیین کردم که حداکثر حجم فایل ۱۰۰ کیلوبایت باشه.

<input name=”MAX_FILE_SIZE” value=”100000″ type=”hidden” />
هرچند این روش کافی نیست و مطمئن نیست ولی میتونه مفید باشه. در ادامه راه های بهتری رو هم ذکر خواهیم کرد.
با استفاده از تگ <input> فیلد رو ایجاد میکنیم تا کاربر بتونه فایل رو آپلود کنه :

<input type=”file” name=”UploadedFile” />
برای اینکه این فیلد برای ارسال فایل مناسب باشه باید مقدار type رو برابر file قرار بدید . همونطور که در سطر بالا میبینید. مشخصه ی name هم مقداری که بهش میدید سلیقه ای هستش که ما در اینجا UploadedFile رو انتخاب کردیم.این مقدار هرچیزی میتونه باشه مثلا اسم شما یا هرچیز دیگه ای ولی باید با حروف شروع بشه و نه با عدد.در صفحه ی بعد با این مقدار (UploadedFile) بیشتر آشنا خواهید شد.
نکته ی دیگه اینکه توجه کنید در اینجا UploadedFile با مقدار uploadedfile متفاوت هست یعنی برزگ و کوچک بودن حروف اهمیت دارند.
تا اینجا صفحه ی html ما کامل شد . میتونید حتی با css فرم آپلود خودتون رو زیبا کنید و بهش شکل و قیافه بدید!