Upload de arquivos com Adobe Flex e Zend AMF

Colocado por Leonardo França na(s) categoria(s): .NET, 1, 2009, 4, 6, action, Actionscript, ActionScript 3, Actionscript 3.0, Actionscript3, Adobe, Adobe Flex, AMF, apache, api, app, AR, arte, Artigo, back, bar, BI, Bindable, boolean, carregar, catch, class, classe, comunicação, control, Controls, custom, Download, err, erro, error, event, EventListener, events, filter, flash, Flex, for, framework, function, Google, handle, html, ide, IE, if, image, int, Java, Javascript, label, library, lite, live, map, mg, MXML, O, on, PHP, procura, progress, pt, reference, Remoting, Ria’s Geral, RoR, server, spark, string, Tema, Teste, TextInput, try, UI, utils, Ved, Widget, Widgets, Wordpress, XML, XP, zend, Zend Amf, zendAMF, zendFramework em 10 18th, 2010 | Sem comentários

O Zend AMF é uma implementação feita em PHP [bb] para se trabalhar com o protocolo de comunicação binário AMF(Action Message Format) fazendo parte do ZendFramework. Precisei implementar um sistema de upload de arquivos que fosse um pouco diferente do que normalmente é usado no Adobe Flash, sendo que essa funcionalidade precisava ser integrada no Zend AMF.

Pesquisando um pouco na net, achei a solução que foi mais simples do que eu imaginava baseada nesse artigo com algumas poucas adaptações.

Começaremos pelo nosso gateway que será usado como endpoint no Adobe Flex.

PLAIN TEXT

PHP:

<?php
require_once ‘Zend/Amf/Server.php’;
require_once ‘Zend/Amf/Exception.php’;
require_once ‘br/com/leonardofranca/vo/FileVO.php’;
require_once ‘br/com/leonardofranca/UploadZendAMF.php’;
 
$server = new Zend_Amf_Server();
$server->setProduction(false);
 
$server->setClass(‘UploadZendAMF’);
 
$server->setClassMap(‘FileVO’,"br.com.leonardofranca.vo.FileVO");
 
echo($server->handle());
?>

Agora o nosso VO com propriedades com nome do arquivo e os binarios.

PLAIN TEXT

PHP:

<?php
class FileVO
{
    public $_explicitType = ‘br.com.leonardofranca.vo.FileVO’;
    public $fileName;
    public $fileData;
    
    function __construct ()
    {}
    
    public function getFileName() 
    {
        return $this->fileName;
    }
 
    public function setFileName($fileName) 
    {
        $this->fileName = $fileName;
    }
 
    public function getFileData() 
    {
        return $this->fileData;
    }
 
    public function setFileData($fileData) 
    {
        $this->fileData = $fileData;
    }
}
?>

Agora nossa classe PHP que ser responsavél por efetudar o upload.

PLAIN TEXT

PHP:

<?php
class UploadZendAMF  
{
    public function __construct()
    {
      
    }
    
    public function upload(FileVO $data)
    {
        try 
        {
            $fileData = $data->getFileData();
            file_put_contents( ‘C:\apache\htdocs\images\’ . $data->getFileName(), $fileData);
            return true;    
        } 
        catch (Exception $e) 
        {
            throw new Exception($e->getMessage());
        }
    }
}
?>

Agora vamos a camada de visão usando o Adobe Flex, começamos com nosso VO.

PLAIN TEXT

ACTIONSCRIPT3:

package br.com.leonardofranca.vo
{
    import flash.utils.ByteArray;
 
    [Bindable]
    [RemoteClass(alias="br.com.leonardofranca.vo.FileVO")]
    public class FileVO
    {
        private var _fileName:String;
        private var _fileData:ByteArray;
        
        public function FileVO()
        {
        }
 
        public function get fileName():String
        {
            return _fileName;
        }
 
        public function set fileName(value:String):void
        {
            _fileName = value;
        }
 
        public function get fileData():ByteArray
        {
            return _fileData;
        }
 
        public function set fileData(value:ByteArray):void
        {
            _fileData = value;
        }
 
    }
}

Agora nosso mxml que carregará os bytes do arquivo para enviar para o Zend AMF.

PLAIN TEXT

MXML:

<?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" creationComplete="application1_creationCompleteHandler(event)">
    <fx:Declarations>
        <!– Place non-visual elements (e.g., services, value objects) here –>
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import br.com.leonardofranca.vo.FileVO;
            
            import mx.controls.Alert;
            import mx.events.FlexEvent;
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            import mx.rpc.remoting.mxml.RemoteObject;
            import mx.utils.ObjectUtil;
            
            private var ro:RemoteObject;
            private var fileRef:FileReference;
            private var fileTypes:FileFilter = new FileFilter("Images (*.jpg, *.jpeg)", "*.jpg; *.jpeg");
            private var allTypes:Array = new Array(fileTypes);
 
            
            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                ro = new RemoteObject();
                ro.destination = "nao faz diferença nenhuma usando com Zend AMF";
                ro.endpoint = "http://localhost:81/ZendAmf/teste_upload.php";
                ro.source = "br.com.leonardofranca.UploadZendAMF";
                ro.addEventListener(ResultEvent.RESULT, handlerResult);
                ro.addEventListener(FaultEvent.FAULT, handlerFault);
                
                btnProcurar.addEventListener(MouseEvent.CLICK, handlerUpload);
                btnSend.addEventListener(MouseEvent.CLICK, uploadVideos);
            }
            
            protected function handlerUpload(evt:MouseEvent=null):void
            {
                fileRef = new FileReference();
                fileRef.addEventListener(Event.SELECT,selectHandler);
                //          fileRef.addEventListener(Event.COMPLETE,completeHandler);
                //          fileRef.addEventListener(ProgressEvent.PROGRESS,progressHandler);
                fileRef.browse(allTypes);
            }
            
            protected function selectHandler(evt:Event):void
            {
                txtFile.text = fileRef.name;
                fileRef.load();
            }
            
            protected function uploadVideos(evt:MouseEvent=null):void
            {
                var data:ByteArray = new ByteArray();
                fileRef.data.readBytes(data,0,fileRef.data.length);
                
                var vo:FileVO = new FileVO();
                vo.fileName = fileRef.name;
                vo.fileData = data;
                
                ro.upload(vo);
            }
            
            protected function handlerResult(re:ResultEvent):void
            {
                trace(ObjectUtil.toString(re.message.body));
                if(Boolean(re.message.body))
                {
                    Alert.show("Arquivo enviado com sucesso!","Sucesso!");
                }
                else
                {
                    Alert.show("Não foi possivel enviar o arquivo!","Error!");
                }
            }
            
            protected function handlerFault(fault:FaultEvent):void
            {
                Alert.show(fault.fault.faultString,"Error!");
            }
            
        ]]>
    </fx:Script>
    <mx:Form>
        <mx:FormItem label="Envio de arquivos" direction="horizontal">
            <s:TextInput id="txtFile"/>
            <s:Button id="btnProcurar" label="Procurar"/>
            <s:Button id="btnSend" label="Enviar"/>
        </mx:FormItem>
    </mx:Form>
</s:Application>