Cool Coder

Hi,

I am very impressed with SWFUpload and will make use of this in future developments. Its kool flash player can handle all things needed for a developer to handle things in client side. There are so many benefits of using this for fileuploads because everything needed for handling file uploads can be done with there flash player so as there is no need of checking through scripts. The only disadvantage is only flash supported clients can handle uploading.

As my fav is cakePHP and i uses 80% of my developments through cake, the first i i thought about integrating SWFUpload to CakePHP. For this as my first work is searched some components for easy use. I have found some. I have made some try to integrate this components and successfully wasted my 2 hours.

Later i though about why cant i directly integrate SWFUpload into the view. Since SWFUpload completely a client side script and just making an ajax call to the server, i planned to go as manual integration and got success.

As i have bad memory i think i need to update this in to blog so that it will be helpful for me in future. And may be you too…. enjoy

Integrating SWFUpload with CakePHP

1. Download SWFUpload from http://code.google.com/p/swfupload/
2. Be sure you have a cakePHP in your server
3. Unzip and place the file in this manner (You can use anywhere and only thing is you should know how to set path in views)
4. Copy all images to app\webroot\img . See i have these images in the folder cancelbutton.gif, XPButtonUploadText_61×22.png
5. Copy all javascript and flash files app\webroot\js\swfupload. I have the following files in mentioned folder now fileprogress.js, handlers.js, swfupload.js, swfupload.queue.js, swfupload.swf, swfupload.swfobject.js, swfuploadbutton.swf
6. In view (You can add this in layout in ‘head’ tag. I have added in view to reduce overload printing these files on all views and i know this is not a good method).

   //This code is in view to print script files
   < ?php e($javascript->link(array(
   		'swfupload/swfupload',
   		'swfupload/swfupload.swfobject',
   		'swfupload/swfupload.queue',
   		'swfupload/fileprogress',
   		'swfupload/handlers',
   		)));    ?>

   Followed by

   // Script code in view enclosed with script tag
   < script>
   var swfu;
   SWFUpload.onload = function () {
   	var settings = {
   		flash_url : site_url + "js/swfupload/swfupload.swf",
   		upload_url: "< ?php echo $html->url('/images/sampleupload/'.$session->id()) ?>",
   		post_params: {
   			"PHPSESSID" : "NONE",
   			".what" : "OKAY"
   		},
   		file_size_limit : "3 MB",
   		file_types : "*.jpg",
   		file_types_description : "JPG Files",
   		file_upload_limit : 30,
   		file_queue_limit : 0,
   		custom_settings : {
   			progressTarget : "fsUploadProgress",
   			cancelButtonId : "btnCancel"
   		},
   		debug: false,
    
   		// Button Settings
   		button_image_url : site_url + "/img/XPButtonUploadText_61x22.png",
   		button_placeholder_id : "spanButtonPlaceholder",
   		button_width: 61,
   		button_height: 22,
    
   		// The event handler functions are defined in handlers.js
   		swfupload_loaded_handler : swfUploadLoaded,
   		file_queued_handler : fileQueued,
   		file_queue_error_handler : fileQueueError,
   		file_dialog_complete_handler : fileDialogComplete,
   		upload_start_handler : uploadStart,
   		upload_progress_handler : uploadProgress,
   		upload_error_handler : uploadError,
   		upload_success_handler : uploadSuccess,
   		upload_complete_handler : uploadComplete,
   		queue_complete_handler : queueComplete,	// Queue plugin event
    
   		// SWFObject settings
   		minimum_flash_version : "9.0.28",
   		swfupload_pre_load_handler : swfUploadPreLoad,
   		swfupload_load_failed_handler : swfUploadLoadFailed
   	};
    
   	swfu = new SWFUpload(settings);
   }

   Please note. My settings may be different. So please read how the settings needed to be given for SWFUpload.onload. Just know how the paths are given. See “upload_url:” This is the path to controller method where it handles the uploads. I will add my method below/ And important is need to pass $session->id(). and in “flash_url:”, site_url is the location (eg: http://localhost/fileuploading)

7. Now we can move to controller. There are few things to note in controller

   // Controller images before filter to handle session->id()
   function beforeFilter() { 
           if ($this->action == 'sampleupload') {
               $this->Session->id($this->params['pass'][0]);
               $this->Session->start();
           }
           parent::beforeFilter();
    
       }

   Then the method simpleupload (I have added some components for uplaoding the file. You can use your own script for uploading)

   // controller method code for uploading
   function sampleupload(){
   		// Code for Session Cookie workaround
   				if (isset($_POST["PHPSESSID"])) {
   					session_id($_POST["PHPSESSID"]);
   				} else if (isset($_GET["PHPSESSID"])) {
   					session_id($_GET["PHPSESSID"]);
   				}
    
    
   			// Check post_max_size (http://us3.php.net/manual/en/features.file-upload.php#73762)
   				$POST_MAX_SIZE = ini_get('post_max_size');
   				$unit = strtoupper(substr($POST_MAX_SIZE, -1));
   				$multiplier = ($unit == 'M' ? 1048576 : ($unit == 'K' ? 1024 : ($unit == 'G' ? 1073741824 : 1)));
    
   			// Settings
   				$save_path = realpath('../../app/webroot/uploads/listings') . "/";;				// The path were we will save the file (getcwd() may not be reliable and should be tested in your environment)
   				$upload_name = "Filedata";
   				$max_file_size_in_bytes = 2147483647;				// 2GB in bytes
   				$extension_whitelist = array("jpg", "gif", "png");	// Allowed file extensions
   				$valid_chars_regex = '.A-Z0-9_ !@#$%^&()+={}\[\]\',~`-';				// Characters allowed in the file name (in a Regular Expression format)
    
   			// Other variables	
   				$MAX_FILENAME_LENGTH = 260;
   				$file_name = "";
   				$file_extension = "";
   				$uploadErrors = array(
   			        0=>"There is no error, the file uploaded with success",
   			        1=>"The uploaded file exceeds the upload_max_filesize directive in php.ini",
   			        2=>"The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form",
   			        3=>"The uploaded file was only partially uploaded",
   			        4=>"No file was uploaded",
   			        6=>"Missing a temporary folder"
   				);
    
    
   			// Validate the upload
   				if (!isset($_FILES[$upload_name])) {
   					$this->HandleError("No upload found in \$_FILES for " . $upload_name);
   					exit(0);
   				} else if (isset($_FILES[$upload_name]["error"]) && $_FILES[$upload_name]["error"] != 0) {
   					$this->HandleError($uploadErrors[$_FILES[$upload_name]["error"]]);
   					exit(0);
   				} else if (!isset($_FILES[$upload_name]["tmp_name"]) || !@is_uploaded_file($_FILES[$upload_name]["tmp_name"])) {
   					$this->HandleError("Upload failed is_uploaded_file test.");
   					exit(0);
   				} else if (!isset($_FILES[$upload_name]['name'])) {
   					$this->HandleError("File has no name.");
   					exit(0);
   				}
    
   			// Validate the file size (Warning: the largest files supported by this code is 2GB)
   				$file_size = @filesize($_FILES[$upload_name]["tmp_name"]);
   				if (!$file_size || $file_size > $max_file_size_in_bytes) {
   					$this->HandleError("File exceeds the maximum allowed size");
   					exit(0);
   				}
    
   				if ($file_size < = 0) {
   					$this->HandleError("File size outside allowed lower bound");
   					exit(0);
   				}
    
    
   			// Validate file name (for our purposes we'll just remove invalid characters)
   				$file_name = preg_replace('/[^'.$valid_chars_regex.']|\.+$/i', "", basename($_FILES[$upload_name]['name']));
   				if (strlen($file_name) == 0 || strlen($file_name) > $MAX_FILENAME_LENGTH) {
   					$this->HandleError("Invalid file name");
   					exit(0);
   				}
    
    
   			// Validate that we won't over-write an existing file
   				if (file_exists($save_path . $file_name)) {
   					$this->HandleError("File with this name already exists");
   					exit(0);
   				}
    
   				// Validate file extension
   				$path_info = pathinfo($_FILES[$upload_name]['name']);
   				$file_extension = $path_info["extension"];
   				$is_valid_extension = false;
   				foreach ($extension_whitelist as $extension) {
   					if (strcasecmp($file_extension, $extension) == 0) {
   						$is_valid_extension = true;
   						break;
   					}
   				}
   				if (!$is_valid_extension) {
   					$this->HandleError("Invalid file extension");
   					exit(0);
   				}
    
   				/* Starts uploading functions */
   				$listing_id = $_POST['listing_id'];
   				/* Ends uploading functions */
    
   				$listing = $this->Listing->read(null , $listing_id);
   				$this->data['Image'] = $_FILES[$upload_name];
   				$file = $_FILES[$upload_name];
    
   		    	if (!empty($listing)) {
   		    		$mls_number = $listing['Listing']['mls_number'];
   		    		$listing_id = $listing['Listing']['id'];
    
   		    	}else{
   		    		$this->HandleError(__('Invalid listing.', true));
    
   		    	}
   				// Begin : uploading images....
   					$errors = array();
    
   						// grab the file
   						$file_name = date('Ymdhis') . ".jpg";
   						// This is a component function use your upload code here
   						$uploaded = $this->Upload->upload($file, $destination_path, $file_name);
    
    
    
   				exit(0);
   	}
    
   	function HandleError($message) {
   		echo $message;
   	}

8. Done.

Please note. Just take the concepts. There may be errors in controller. Use it with your idea

Amjith