Validation for stopping wrong file Upload at Browsing time

Hi,

We all know that to make use of browse window facility, Flex provides inbuilt class ‘FileReference’ which has method named “browse”, Which allows us to open the File Browsing window.

To restrict the Browsing window to open some limited file extensions(Such as .mp3,.mp4 file only), we make use of  FileFilter class which holds the fileFilter to be applied to the browsing window

eg.

private var allFileFilter:FileFilter = new FileFilter(“All, *.mp3; *.mp4; *.flv; *.wmv; *.mpeg; *.mpg;”, “*.mp3; *.mp4; *.flv; *.wmv; *.mpeg; *.mpg; “);

private var fileRef:FileReference = new FileReference();
fileRef.browse([allFileFilter]) ;

But this File filter validation can be broken easily to Upload wrong files, For this just type *.* and press enter , Here you see all files available for upload Now select Any Invalid file and go with upload.

So in such cases we need to apply self made file extesion validation logic which should be able to verify the extension of the file to be uploaded.

So here is short and sweet sample code to workout this logic,

Best Luck

 

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml“  pageTitle=”Upload Functionality Usage And Validation” layout=”absolute”>
 <mx:Script>
  <![CDATA[
   import mx.utils.StringUtil;

   
   /**
   * Standard File extensions allowed to be Uploaded
   */
   private var fileTypeArray:Array = ["mp3","mp4","flv","wmv","mpeg","mpg","rtf","doc","txt"];
   
   /**
   * Selected file type,Selected from Browsing window
   */
   private var fileType:String;
   
   /**
   * FileReference class object provides browsing and uploading methods
   */
   private var fileRef:FileReference = new FileReference();
   
   /**
   * File Filters Applied for restriction of Files to be browsed
   */

 //FileFilter takes two Arguments 1. Description to be shown in Browse window. 2. List of Extensions
   private var allFileFilter:FileFilter = new FileFilter(“All, *.mp3; *.mp4; *.flv; *.wmv; *.mpeg; *.mpg;”, “*.mp3; *.mp4; *.flv; *.wmv; *.mpeg; *.mpg; “);
   private var videoFilter:FileFilter = new FileFilter(“Video, *.flv; *.wmv; *.mpeg; *.mpg;”, “*.flv; *.wmv; *.mpeg; *.mpg;”);
   private var audioFilter:FileFilter = new FileFilter(“Audio, *.mp3; *.mp4; *.wma;”, “*.mp3; *.mp4; *.wma;”);
   private var textFilter:FileFilter = new FileFilter(“Test, *.rtf; *.doc; *.txt;”, “*.rtf; *.doc; *.txt;”);
   
   /**
   * Function for validating the correct file extension.
   */
   private function validateFileType(fileName:String):Boolean
   {
    txtErr.text = ”;
    txtFileName.text = ”;
    fileName = StringUtil.trim(fileName.toLowerCase());
    var fileExtensionArray:Array = fileName.split(“.”);
    if(fileExtensionArray.length>1)
    {
      fileType= fileExtensionArray[fileExtensionArray.length-1];
     for(var i:int =0;i<fileTypeArray.length;i++)
     {
      if(fileType==fileTypeArray[i])
      {
       txtErr.text = ” File Selected is of proper Extension, Thank You.”;
       txtFileName.text=” Uploaded File Name is =>” + fileRef.name +
       ”\n Size is => “+fileRef.size+” bytes”
       ”\n Creation Date is => “+ fileRef.creationDate +
       ”\n Creator is => “+ fileRef.creator ;
       return true;
      }
     }
    }
    txtErr.text = “You have not Uploaded the file within the standerd extensions provided.”;
    return false;
   }
   
   /**
   * Function Used to open the Browsing window
   */
   private function selectFile():void
   {
    fileRef = new FileReference();
    //browse method excepts the filefilter array as an arguement
                fileRef.browse([allFileFilter,audioFilter,videoFilter,textFilter]);
                fileRef.addEventListener(Event.SELECT, onSelectFile);
   }
   
    
    /**
   * Function used to catch the Select event
   */
   private function onSelectFile(event:Event):void
   {
       validateFileType(fileRef.name);
     }
     
  ]]>
 </mx:Script>
 
 
 <mx:Button x=”63″ y=”86″ label=”Browse”  click=”selectFile()”/>
 <mx:TextArea id=”txtFileName”  editable=”false” x=”161″ y=”114″ width=”360″ height=”97″/>
 <mx:Text color=”#ffffff” selectable=”false” id=”txtErr” x=”161″ y=”63″ width=”397″ height=”25″/>
 <mx:Label x=”143″ y=”47″ selectable=”false” text=”Enter *.* in file name of browsing window to Select wrong file.” fontWeight=”bold” fontSize=”15″/>
 <mx:Label x=”161″ y=”86″ selectable=”false” text=”Retrived Local File Information => “/>
 <mx:Label x=”161″ y=”256″  selectable=”false” text=”Validate wheather the selected file is valid or Not.”/>
</mx:Application>

 

Best Luck

 Thanks and regards

Shashank Kulkarni

Feel free to mail me :) shashank.pawan@gmail.com