'AMF3'에 해당되는 글 2건

  1. 2010.10.02 Flex와 PHP(CodeIgniter+ZendAMF) 연동하기 3
  2. 2010.10.02 Browser's RIA Data Loading Benchmarks


이전 글 CodeIgniter 라이브러리에 ZendAMF 추가하기를 마치셨다면 이번에는 Flex와 연동하는 것을 시작하겠습니다.
대부분은 글은 머드초보님의 글을 바탕으로 진행할 예정입니다.(출처: [Flex/PHP] Zend AMF를 이용한 PHP와 FLEX의 연동삽질후기)

①. 먼저 DB를 생성하고 데이터입력입니다

DROP TABLE IF EXISTS `sosi`.`sosi`; 
CREATE TABLE  `sosi`.`sosi` ( 
  `idx` int(10) unsigned NOT NULL AUTO_INCREMENT, 
  `sosiname` varchar(45) NOT NULL, 
  `height` int(10) unsigned NOT NULL, 
  `blood` varchar(45) NOT NULL, 
  PRIMARY KEY (`idx`) 
) ENGINE=InnoDB AUTO_INCREMENT=10 DEFAULT CHARSET=utf8; 
 
INSERT INTO `sosi` (`idx`,`sosiname`,`height`,`blood`) VALUES  
 (1,'윤아',166,'B'), 
 (2,'수영',170,'O'), 
 (3,'효연',160,'AB'), 
 (4,'유리',167,'AB'), 
 (5,'태연',162,'O'), 
 (6,'제시카',163,'B'), 
 (7,'티파니',162,'O'), 
 (8,'써니',158,'B'), 
 (9,'서현',168,'A');

 

②. Flex Project 'ZendAmfTest'를 만듭니다. 머드초보님은 Application server type을 php으로 하셨는데 저는 서버가 외부에 있어서 None/Other로 하였습니다. 로컬이라면 php를 선택하신 다음에 아파치나 iis가 돌아가는 폴더를 지정하면 됩니다. 지정하게 되면 SWF가 서버로 바로 위치하게 되므로 테스트하기 편합니다.

③. 그런 다음 system>application>libraries에 sosimember.php라는 파일을 만듭니다. CI특성상 파일명은 소문자로 만드셔야합니다.


 

④. 다음은 DB에서 데이터를 가져오고 반환하는 모델을 만듭니다. system>application>models에 sosimodel.php를 생성하시고 아래 코드입력합니다.
load->library("SosiMember");
    	
        $query = $this->db->query('SELECT idx, sosiname, height, blood FROM sosi;');
        
        $ret = array();
        foreach ($query->result() as $row){        
            $tmp = new SosiMember(); 
            $tmp->idx = $row->idx; 
            $tmp->sosiname = $row->sosiname; 
            $tmp->height = $row->height; 
            $tmp->blood = $row->blood; 
            $ret[] = $tmp; 
        } 
        return $ret; 
    }
}  
?>

⑤. 다음은 controllers를 만듭니다. 여기에 ZendPHP가 들어갑니다. system>application>controllers에 remote.php를 생성하시고 아래 코드입력합니다.
load->model('SosiModel');    
    }
    
    public function index()
    {
        $this->load->library("Apps");
        $this->apps->load("Zend/Amf/Server");
        $server = new Zend_Amf_Server();
        $server->setClass("SosiModel"); 
		$server->setClassMap("SosiMember", "SosiMember"); 
		echo($server -> handle()); 
        
    }
}  
?>

⑥. 이제 Flex에게 PHP를 연결할 설정을 역할을 하는 service-config.xml을 만듭니다.
 
  
      
         
             
                    
              
             
                  
                    *  
                     
                
          
      
      
          
             
          
     

⑦. Flex파일 ZendAmfTest.mxmlf에 아래 코드를 입력합니다.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml
    layout="vertical"
    creationComplete="creationCompleteHandler()">
 <mx:Script>
  <![CDATA[
   import mx.controls.Alert;
   import mx.rpc.events.ResultEvent;
   import mx.rpc.events.FaultEvent;
   
   private function creationCompleteHandler():void
   {
    roSosi.getData();
   }
   
   private function faultHandler(event:FaultEvent):void
   {
    Alert.show(event.message.toString());
   }
   
   private function resultGetDataHandler(event:ResultEvent):void
   {
    dgSosi.dataProvider = event.result as Array;
   }
  ]]>
 </mx:Script>
 
 <mx:RemoteObject id="roSosi" fault="faultHandler(event)" destination="zend" source="SosiModel">
  <mx:method name="getData" result="resultGetDataHandler(event)" />
 </mx:RemoteObject>
 
 <mx:DataGrid id="dgSosi" width="100%" height="100%">
  <mx:columns>
   <mx:DataGridColumn headerText="아이디" dataField="idx"/>
   <mx:DataGridColumn headerText="소녀시대이름" dataField="sosiname"/>
   <mx:DataGridColumn headerText="신장" dataField="height" />
   <mx:DataGridColumn headerText="혈액형" dataField="blood" />
  </mx:columns>
 </mx:DataGrid>  
</mx:Application>

SyntaxHighlighter가 Flex를 지원하지 않네요ㅠ
만약 다른 서비스를 추가하게 된다면, <mx:RemoteObject>에서 endpoint를 다른 url로 잡아주면 됩니다.
<mx:RemoteObject id="roAnother" fault="faultHandler(event)"  
       
destination="zend" source="AnothorService"  
       
endpoint="http://localhost/ZendAmfTest-debug/another_amf.php">


그렇게 Flex를 컴파일 하게 되면 아래와 같이 출력됩니다.


이상입니다. 혹시 에러나 잘못된 점은 지적해주시기 바랍니다.

참고사이트:

http://corlan.org/2008/11/13/flex-and-php-remoting-with-zend-amf/ 
http://mudchobo.tomeii.com/tt/398

Posted by Finebe
,


RIA에서 Data Loading은 중요한 요소입니다. 대부분이 서버와 데이터연동을 통하기 때문입니다.
어떤 Data Format이 좋을까 고민할 수도 있습니다. HTTP, SOAP, XML, Dojo, JSON, AMF3등 중에서도 자주 쓰이는 방식은  HTTP, XML,  JSON, AMF3등이 있습니다. 지금 알아볼려고 하는 벤치마크도 이 4개의 데이터포멧을 가지고 진행될 예정입니다.
브라우저별로 렌더링엔진, 스크립트엔진이 틀리기때문에 벤치마크에 대한 결과도 틀립니다.
그래서 제가 자주 사용하는 브라우저 3개만 벤치마크해보았습니다.

벤치마크에 사용될 브라우저와 대상 데이터포멧
 Benchmarks Browser  Internet Explorer8,Firefox 3.6.8, Chrome
 Benchmarks Data Format  HTTP, XML, JSON, AMF3

벤치마크방법:
  1. 모든 브라우저, 실행프로그램들을 꺼둔 상태(메모리, CPU할당량 최소화)
  2. 벤츠마크 사이트: http://www.jamesward.com/census/
  3. IE8->Firefox->Chrome으로 진행


벤치마크 결과:

-Internet Explorer8
Data 500Rows 보냈을때

Data 5,000Rows 보냈을때


-Firefox 3.6.8
 Data 500Rows 보냈을때

Data 5,000Rows 보냈을때


-Chrome
Data 500Rows 보냈을때

Data 5,000Rows 보냈을때


-벤치마크를 마치며
 벤치마크프로그램 시간내서 만들 생각을 하고 있었는데 마침 Server Exec Time, Transfer Time, ParseTime, RenderTime까지 나오는 친절한 벤치마크를 발견했습니다. 위 그림을 보시면 한눈에 브라우저 별로 데이터처리속도가 틀린것을 알 수 있습니다. 특히 IE8은 타브라우저보다 훨씬 느립니다.ㅎㄷㄷ.

 데이터 처리건수  500건  5,000건
 데이터 처리속도  XML>AMF3>JSON>HTML  AMF3>>XML>JSON>HTML
 데이터 크기(작은순)  AMF3>JSON>XML>HTML  AMF3>>>JSON>XML>HTML

IE8에서는 데이터크기가 커지니 XML ParseTime이 매우 늘어나 느려지는 것을 확인할 수 있습니다. 데이터 처리건수가 커질 수록 AMF3는 XML보다 월등한 처리속도를 보여줍니다(XML의 ParseTime은 처리건수에 비례). 또한 AMF3 데이터크기는 JSON의 1/10정도밖에 되질 않는 것도 확인이 되었습니다. 이러한 벤치마크결과들이 제 고민을 해결해주었습니다.

'Application Programming > Flex & Flash' 카테고리의 다른 글

Actionscript Vector 초기화(initialization)  (6) 2011.02.16
Flash AMF 의 개요  (0) 2010.03.08
Flex Builder 3에 JSON적용하기  (2) 2010.01.13
Posted by Finebe
,