آپلود فایل به کمک Air و PHP در Flash

[yaa110]

در این درس نحوه برقراری ارتباط بین Air و PHP به منظور Upload فایل روی Server آموزش داده می‌شود. ابتدا یک فرم مخصوص آپلود می‌سازیم، سپس کدهای مربوط به PHP را نوشته و فایل‌های مورد نیاز را روی Server قرار می‌دهیم. در نهایت کدهای مربوط به نرم افزار را در Flash اضافه می‌کنیم. برای آپلود فایل‌ها از FileReference، URLRequest و URLVariables استفاده می‌کنیم.

1- برای شروع یک پروژه جدید Air ایجاد کنید.

۲- به کمک کامپوننت‌های Button , Text Input و به کمک ابزار Rectangle این فرم را بسازید.

۳- یک برنامه Editor باز کنید و این کدها را در آن بنویسید، سپس فایل را با نام uploader_script.php ذخیره کنید.

<?php $todayDate = $_POST['todayDate'];
$Name = $_POST['Name'];
$Email = $_POST['Email'];
$filename = $_FILES['Filedata']['name'];
$filetmpname = $_FILES['Filedata']['tmp_name'];
$fileType = $_FILES["Filedata"]["type"];
$fileSizeMB = ($_FILES["Filedata"]["size"] / 1024 / 1000);
move_uploaded_file($_FILES['Filedata']['tmp_name'], “images/”.$filename);
$myFile = “logFile.txt”;
$fh = fopen($myFile, ‘a’) or die(“can’t open file”);
$stringData = “\n\ntodayDate: $todayDate \n Name: $Name \n Email: $Email \n ssid: $ssid \n FileName: $filename \n TmpName: $filetmpname \n Type: $fileType \n Size: $fileSizeMB MegaBytes”;
fwrite($fh, $stringData);
fclose($fh);
?>

در این کدها ابتدا اطلاعات با متد POST دریافت می‌شود.
سپس فایل‌های آپلود شده به داخل فولدر images که در کنار همین فایل PHP باید بسازیم منتقل می‌شوند و نام اصلی فایل برای آن حفظ می‌شود.
در ادامه اطلاعات مربوط به فایل در یک فایل متنی به نام logFile.txt ذخیره می‌شود.

۴- حالا فایل PHP را در Server خود آپلود کنید. در کنار این فایل یک فولدر به نام images و یک فایل متنی به نام logFile.txt ایجاد کنید و Permission آنها را ۷۷۷ قرار دهید.

۵- پنل Actions را برای فریم اول پروژه فلش فعال کنید.

۶- حالا باید کلاسه مورد نیاز را import کنید:

import flash.net.URLRequest;
import flash.net.FileFilter;
import flash.net.FileReference;
import flash.events.ProgressEvent;
import flash.events.Event;
import flash.net.URLRequestMethod;
import flash.net.URLVariables;

7- اطلاعات اولیه مربوط به دکمه‌ها و سایر قسمت‌هایی را که در فرم بالا قابل مشاهده هستند، به صورت زیر تعریف کنید:

upload_btn.enabled = false;
progressBar.width = 1;
uploadMsg.text = “Select a File …”;

8- متغیر URLRequest را که به آدرس فایل PHP بر روی Server متصل می‌شود، به صورت زیر تعریف کنید:

var URLrequest:URLRequest = new URLRequest(“http://flashcenter.ir/navid/uploader_script.php”);

9- در این آموزش در نظر داریم که کاربر فقط بتواند فایل عکس و متن را با برنامه آپلود کند، بنابراین فیلتر فایل‌ها را به صورت زیر تعریف می‌کنیم و هر دو نوع فیلتر را در یک آرایه قرار می‌دهیم:

var imageTypes:FileFilter = new FileFilter(“Images (*.jpg, *.jpeg, *.gif, *.png)”, “*.jpg; *.jpeg; *.gif; *.png”);
var textTypes:FileFilter = new FileFilter(“Text Files (*.txt, *.rtf)”, “*.txt; *.rtf”);
var allTypes:Array = new Array(imageTypes, textTypes);

10- یک FileReference جدید می‌سازیم و Event Listener‌های مربوط به انتخاب موفق فایل توسط کاربر، کامل شدن آپلود و حین پیشرفت آپلود را برای آن به صورت زیر تعریف می‌کنیم:

var fileRef:FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, syncVariables);
fileRef.addEventListener(Event.COMPLETE, completeHandler);
fileRef.addEventListener(ProgressEvent.PROGRESS, progressHandler);

11- حالا Event Listener‌های مربوط به کلیک روی دکمه‌ها را تعریف کنید.

browse_btn.addEventListener(MouseEvent.CLICK, browseBox);
upload_btn.addEventListener(MouseEvent.CLICK, uploadVars);

12- تابعی که بعد از کلیک روی دکمه Browse فراخوانی می‌شود، به صورت زیر تعریف می‌شود. بعد از کلیک روی این دکمه کاربر باید پنجره انتخاب فایل را با فیلترهایی که قبلا آماده شدند، ببیند.

function browseBox(event:MouseEvent):void {
fileRef.browse(allTypes);
}

13- تابعی که بعد از انتخاب موفق فایل توسط کاربر، فراخوانی می‌شود، به صورت زیر تعریف می‌شود. در این تابع ابتدا آدرس فایل در فیلد مربوطه نشان داده می‌شود. سپس دکمه آپلود فعال و ProgressBar آماده می‌شود، در ادامه اطلاعات مورد نیاز PHP به کمک URLVariables جمع آوری می‌شود و این اطلاعات توسط متد POST برای PHP آماده ارسال می‌شوند.

function syncVariables(event:Event):void {
fileDisplay_txt.text = “” + fileRef.name;
upload_btn.enabled = true;
progressBar.width = 1;
var variables:URLVariables = new URLVariables();
variables.todayDate = new Date();
variables.Name = “Flash Center”;
variables.Email = “[email protected]”;
URLrequest.method = URLRequestMethod.POST;
URLrequest.data = variables;
}

14- حالا وقت آن رسیده است تابعی را تعریف کنیم که بعد از کلیک روی دکمه Upload فراخوانی می‌شود و اطلاعات را به PHP می‌فرستد. یکی از این اطلاعات، خود فایل انتخاب شده است که با دستور upload توسط FileReference ارسال می‌شود.

function uploadVars(event:MouseEvent):void {
uploadMsg.text = “Uploading …”;
fileRef.upload(URLrequest);
upload_btn.enabled = false;
}

15- توابع مربوط به کامل شدن و حین پیشرفت آپلود به صورت زیر تعریف می‌شوند.

function completeHandler(event:Event):void {
uploadMsg.text = fileRef.name + ” has been uploaded.”;
fileDisplay_txt.text = “”;
}

function progressHandler(event:ProgressEvent):void {
progressBar.width = Math.ceil(241 * (event.bytesLoaded / event.bytesTotal));
}

در صورتی که نیاز داشتید می‌توانید این پروژه را به صورت swf و AS3 در کنار فایل PHP آپلود کنید. اما اگر قرار است این برنامه بر روی Desktop کار کند حتما باید از پروژه Air استفاده کنید.

http://flashcenter.ir/fa/?p=50