8 Replies Latest reply on Apr 15, 2010 7:41 PM by David_F57

    Uploading Files to Server Using AMFPHP

    Striker9099 Level 2

      Hey everyone. I'm trying to build an application which allows the user to upload jpg files. For that I'm using AMFPHP and trying to send a ByteArray to the php service file. But I keep getting the following errors:

       

      Severity and Description     Path     Resource     Location     Creation Time     Id
      1061: Call to a possibly undefined method load through a reference with static type flash.net:FileReference.     MultiGallery/src     MultiGallery.mxml     line 86     1271268938265     99

      Severity and Description     Path     Resource     Location     Creation Time     Id
      1119: Access of possibly undefined property data through a reference with static type flash.net:FileReference.     MultiGallery/src     MultiGallery.mxml     line 93     1271268938266     100

       

      These are the lines of code generating the errors:

       

      private function loadFile(e:Event):void

                {

                     file.addEventListener.(Event.COMPLETE, uploadFileComplete);

                     file.addEventListener(ProgressEvent.PROGRESS, onUploadProgress);

                     file.load();

                }

                

                private function uploadFileComplete(e:Event):void

                {

                     var fileRef:FileReference = e.target as FileReference;

                     var fileName:String;     

                     byteData = fileRef.data;

                     fileName = fileRef.name;

                }

      Any suggestions please?

       

      Thanks in advance!

        • 1. Re: Uploading Files to Server Using AMFPHP
          David_F57 Level 5

          Hi,

           

          I always use amfphp and i'm not the greatest of php developers but these are the routines I used to send an image byte array up to the server,

           

          declaration for remote objects

           

          <mx:RemoteObject id="catalog" fault="onFault(event)" showBusyCursor="true" source="qiksales" destination="amfphp">

                  <mx:method name="uploadImage" result="qryUpImage(event)" />

                  <mx:method name="downloadImage" result="qryDownImage(event)" />

          </mx:RemoteObject>

           

           

          this routine takes a displayobect(edited image) gets its bitmap data/compresses it into a bytearray(can be jpg/png) then sends it through the remote object call to the php function

           

          private function saveImage() : void

          {

                  var Bmp : Bitmap = new Bitmap(Bitmap(myImage.content).bitmapData.clone());

          try    

          {

          TmpImg = PNGEncoder.encode(Bmp.bitmapData);

          }

          finally

          {

          catalog.uploadImage(TmpImg);

          }

          }

           

           

          the php function to save a bytearray to an sqldatabase

           

          function uploadImage($ba) {

          $data = $ba->data;

          $mysql = mysql_connect(localhost,"root","");

          $data = mysql_real_escape_string($data);

          mysql_select_db( "catalog" );

          $Query = "INSERT INTO images (ID,data) VALUES(0,'$data')";

          $Result = mysql_query( $Query );

          return $Result;

          }

          Not sure if this is helpful but it's one way of getting an image to the server.
          David

          1 person found this helpful
          • 2. Re: Uploading Files to Server Using AMFPHP
            David_F57 Level 5

            Hi,

             

            I'm a bit lazy so here is an example of loading images using file reference, you could use the loaded bytearray's and send them straight to the server, as per the upload routine in the previous post.

             

             

            David.

            • 3. Re: Uploading Files to Server Using AMFPHP
              Striker9099 Level 2

              Hey David, thanks for the reply. I went through the code and it looks decent. But I could not find the example using FileReference you mentioned in your second post, maybe you forgot to copy it?

               

              Anyway, what I'm looking for is basically use the FileReference class to allow the user to browse for an image on his local HDD and then upload it to the server. Then in my php code I'll save the image in a directory, make another resized copy and store it in a thumbs folder, and then insert the paths to the uploaded image and the thumb into a database.

               

              If I can use RemoteObject to do that I'd like to know how. Otherwise, I'll have to write some php script that does that and then call it from FileReference.upload()... but I prefer the RemoteObject since it allows me to call methods inside the php service file.

              • 4. Re: Uploading Files to Server Using AMFPHP
                David_F57 Level 5

                Hi,

                 

                Must have hit the wrong cut n paste button, or the forum ate up the url.

                 

                http://gumbo.flashhub.net/pagedrop/

                 

                the source is included

                 

                hope this is also helpful.

                 

                 

                David.

                • 5. Re: Uploading Files to Server Using AMFPHP
                  Striker9099 Level 2

                  I still don't understand why my script is throwing errors... in your code you're referencing the data property of the FileReference class but it still works fine.

                   

                              private function getImage(e:Event): void
                              {
                                  fr.removeEventListener(Event.COMPLETE, getImage);
                                  if (fr.data.length > 0)
                                  {
                                      var ba: ByteArray = new ByteArray();
                                      ba = fr.data;
                                      ImageCollection.addItem(ba);
                                  }
                                  loopList(ImageLoop);
                              }

                   

                  Why is it causing problems when I do that? I'm starting to think of lame excuses like maybe because I'm using Flex Builder 3 and not Flash Builder 4? Or maybe I'm building for Flash Player 9 and not 10? (am not sure about this though).

                   

                  I donno... this is really confusing..

                  • 6. Re: Uploading Files to Server Using AMFPHP
                    David_F57 Level 5

                    Hi,

                    this code is flex 4 but you can still use the routines in flex 3, If it doesn't work with fp 9 try targetting 10 to see if that works, I cant remember what actually changed in filereference from fp 9 to fp 10. The code takes the filereference data sends it to the amfphp service which saves the image to the server.

                     

                    I also have another version that can resize the image before sending it but need to test it a bit.

                     

                    <?xml version="1.0" encoding="utf-8"?>

                    <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                       xmlns:s="library://ns.adobe.com/flex/spark"

                       xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" viewSourceURL="srcview/index.html">

                    <fx:Declarations>

                    <mx:RemoteObject id="uploader" fault="onFault(event)" showBusyCursor="true" source="uploader" destination="amfphp">

                    <mx:method name="localimg" result="isImageUploaded(event)" />

                    </mx:RemoteObject>

                    </fx:Declarations>

                     

                    <fx:Script>

                    <![CDATA[

                    import mx.controls.Alert;

                    import mx.rpc.events.FaultEvent;

                    import mx.rpc.events.ResultEvent;

                     

                     

                    private var fr:FileReference = new FileReference();

                     

                    private function loadImage(): void

                    {

                    fr.addEventListener(Event.SELECT, selectedImage);

                    fr.addEventListener(Event.COMPLETE,getImage);

                    var imagesFilter:FileFilter = new FileFilter("Images", "*.jpg;*.gif;*.png");

                    fr.browse([imagesFilter]);

                    }

                     

                    private function selectedImage(e:Event): void

                    {

                    fr.removeEventListener(Event.SELECT, selectedImage);

                    fr.load();

                    }

                     

                    private function getImage(e:Event): void

                    {

                    fr.removeEventListener(Event.COMPLETE, getImage);

                    if (fr.data.length > 0)

                    {

                    uploader.localimg(fr.data,fr.name);

                    }

                    }

                     

                    private function onFault(e:FaultEvent): void

                    {

                    Alert.show(e.message.toString(),"Error");

                    }

                     

                    private function isImageUploaded(e:ResultEvent): void

                    {

                    Alert.show(e.message.toString(),"Result");

                    }

                     

                    ]]>

                    </fx:Script>

                    <s:Button x="67" y="54" label="Button" click="loadImage()"/>

                    </s:Application>

                     

                    php

                    ===

                    class uploader

                    {

                    function uploader()

                    {

                    // Define the methodTable for this class in the constructor

                    $this->methodTable = array(

                    "Image Uploader" => array(

                    "description" => "local to server image class",

                    "access" => "remote"

                    )

                    );

                    }

                     

                    function localimg($ba,$fname) {

                    $deffilepath = '../../images/full/'.$fname;

                    $data = $ba->data;

                    //$data = mysql_real_escape_string($data);

                    file_put_contents($deffilepath, $data);

                        return ("done");

                    }

                    }

                    ?>

                    • 7. Re: Uploading Files to Server Using AMFPHP
                      Striker9099 Level 2

                      Alright I tried targeting Flash Player 10.1.53.7 and that solved the issue! Thanks a lot man

                       

                      By the way, I would really appreciate it if you would share the code which resizes the image. I could post my version too, which is a php script using the GD Library.

                      • 8. Re: Uploading Files to Server Using AMFPHP
                        David_F57 Level 5

                        Hi,

                         

                        I think so long as you target fp 10 you should be ok so 10.0.0,  10.1 is still a bit away from being on everyone's pc.

                         

                         

                        The attached code uses a resize class, the idea is you specify the displayobject and max width ( if the image is portrait the height will become max width otherwise the final width will be the passed parameter). I felt for thumbnails using a restrictive rectangle was better than using a set width or height.

                         

                        The thing could probably do with a lot of 'tidying' but it gets the job done

                         

                         

                        Hope you find it helpful.

                         

                         

                        David.

                         

                         

                        cant seem to attach code so http://gumbo.flashhub.net/sample.zip