머드초보의 블로그

젠장 ^^
이클립스 플러그인으로 Flex Builder를 설치하면 BlazeDS를 사용하기 훨씬 쉬워집니다-_-;
저 아래에 있는 방법은 다 생까고-_-; 다시 해보도록 합시다.

우선 플렉스빌더3 이클립스 플러그인버전으로 받습니다.
플러그인 버전이 없어진 줄 알았는데 저기에 저렇게 써있군요.
Already have Eclipse installed? Download the Flex Builder Eclipse plugin instead.
저거 클릭하고 로그인하면 받을 수 있습니다.

이클립스에 설치를 하도록 합시다 ^^
설치를 하고 이클립스를 띄워 봅시다.
New -> Project -> Flex Project를 선택!
Project name은 HelloBlazeds라고 합시다.
Web Application을 선택하고, Server technology에서 Application server type은 J2EE로 합시다.
Next를 클릭하고 J2EE settings에서 Apache Tomcat v6.0을 설정(없으면 New해서 설정^^)하고
Flex WAR file을 blazeds.war(http://opensource.adobe.com/wiki/display/blazeds/Release+Builds에서 받을 수 있습니다)파일을 선택합니다. Finish를 클릭합니다.

저는 전에 이클립스랑 Flex Builder랑 따로 설치해서 따로 작업을 했는데 저렇게 하면 바로 eclipse에서도 tomcat테스트가 가능합니다 ㅠㅠ 난 왜이렇게 바보 같지-_-;

그러면 이제 짬뽕이 되어있습니다! 참고로 src폴더는 자바소스폴더구요.
flex_src폴더는 flex소스폴더겠죠? ^^

예제는 요 아래에 있는 예제 고대로 따라하시면 될껍니다 ^^
근데 다 소스넣고 실행할라그러면 이상하게 요런 에러가 떠요.
실패 메세지 : faultCode:Client.Error.MessageSend faultString:'Send failed' faultDetail:'Channel.Connect.Failed error NetConnection.Call.Failed: HTTP: Status 404: url: 'http://localhost:8080/WebContent/messagebroker/amf''

보니까 ContextRoot가 이상하게 WebContent로 되어있어요-_-;
바꿔줍시다. HelloBlazeds프로젝트이름에 마우스오른쪽을 대고 properties를 선택합니다.
Flex Server부분이 있습니다. WebContent로 되어있습니다.
HelloBlazeds로 바꿉시다. 그러고 나서 실행해봅시다.
이클립스에 등록된 tomcat에다가 프로젝트를 추가해야합니다. HelloBlazeds라는 프로젝트를 추가를 하고 서버를 실행합시다. 그러고나서 url을 요청합니다.
http://localhost:8080/HelloBlazeds/HelloBlazeds.swf
그러면 이제 될껍니다-_-;

ps1. 저거왜 WebContent로 되어있을까요? 제가 뭘 잘못 한걸까요?-_-;
ps2. BlazeDS를 사용하시려면 이클립스 플러그인으로 플렉스 빌더를 사용하시는게 건강에 좋습니다-_-;
ps3. 에이레네님이 번역한거 읽으러 가야지-_-;

몰랐는데 AIR에서도 되네요-_-;

우선 http://mudchobo.tomeii.com/tt/211 이거랑
http://mudchobo.tomeii.com/tt/214 이거를 참조하셔서 새로운 blazeds.war를 만들어서 톰캣에 띄워야합니다.

New Project로 만들고, ProjectName을 AirBlazedsTest라고 합시다.
Desktop application을 선택하고 J2EE를 선택하고, 넥스트를 누릅니다 ^^

Server location은 위에 따라했다면 그대로 되어 있을꺼에요^^
Finish를 클릭해줍시다.

AIR에서는 좀 다르게 몇줄을 더 추가해야하는데요.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" 
   layout="absolute">
 <mx:Script>  
  <![CDATA[
   import mx.messaging.ChannelSet;
   import mx.messaging.channels.AMFChannel;   
   import mx.rpc.events.ResultEvent;   
   import mx.rpc.events.FaultEvent;   
   import mx.rpc.remoting.RemoteObject;   
   import mx.controls.Alert;      
   private var startTime:Number;       
   private function resultHandler(event:ResultEvent):void{        
    dg.dataProvider = event.result;   
   }      
   
   private function faultHandler(event:FaultEvent):void{        
    mx.controls.Alert.show("실패 메세지 : " + event.fault.message);   
   }      
   
   private function retrieve():void  {   
    var amfChannel:AMFChannel = new AMFChannel(
     "my-amf", "http://localhost:8080/blazeds/messagebroker/amf");
    var channelSet:ChannelSet = new ChannelSet();
    channelSet.addChannel(amfChannel);
   
    var srv:mx.rpc.remoting.RemoteObject = new RemoteObject();   
    srv.channelSet = channelSet;
    srv.destination = "member";       
    startTime = new Date().time;   
    srv.getElements();        
    srv.addEventListener("result",resultHandler);   
    srv.addEventListener("fault",faultHandler);   
   }     
   
   private function logResult():void  {   
    if (startTime > 0)   {    
     log.text = "" + (new Date().time - startTime) + " milliseconds";  
    }  
   }    
  ]]> 
 </mx:Script>   
 
 <mx:Panel title="AS를 이용한 RemoteObject예" width="100%" height="100%">  
  <mx:DataGrid id="dg" width="100%" height="100%"                  
   updateComplete="logResult()"/>   
  <mx:ControlBar>    
   <mx:Button label="데이터 가져오기" click="retrieve()"/>   
   <mx:Label id="log"/>   
  </mx:ControlBar> 
 </mx:Panel>
</mx:WindowedApplication>

AIR에서도 돼요-_-; 레몬펜그은부분만 추가를 해주시면 돼요 ^^

우선 MySQL에 DB가 있어야겠죠?

CREATE TABLE `Member_List` (
  `ID` varchar(10) NOT NULL,
  `Password` varchar(10) NOT NULL,
  `Name` varchar(10) NOT NULL,
  `Age` int(2) NOT NULL,
  `Sex` varchar(2) NOT NULL,
  `Tel` varchar(12) NOT NULL,
  PRIMARY KEY  (`ID`)
) ENGINE=MyISAM DEFAULT CHARSET=euckr COMMENT='회원 멤버 리스트입니다.';

INSERT INTO `Member_List` (`ID`, `Password`, `Name`, `Age`, `Sex`, `Tel`) VALUES 
('mudchobo', '1234', '성종천', 25, '남', '01000000000'),
('k1011606', '1234', '강현욱', 24, '남', '01000000000'),
('shs8326', '1234', '성현식', 58, '남', '01000000000'),
('jor0737', '1234', '조옥렬', 49, '여', '01000000000'),
('boazzang', 'boalove', '보아짱', 30, '여', '0100000000'),
('webserv', 'babo', '웹서비스', 45, '남', '01000000000'),
('child', 'ggoma', '꼬마', 15, '여', '01000000000'),
('mudcosdf', '1234', '성종텬', 99, '남', '01000000000');

자바클래스를 작성해봅시다.

그리고 blazeds프로젝트에 WebContent/WEB-INF/lib에 mysqlconnector넣는거 잊지마세요 ^^

blazeds프로젝트 아래 Java Resources: src부분에서 패키지를 만듭시다.
flex.member라는 패키지를 만들고, MemberVo라는 클래스를 생성해봅시다.

package flex.member;

public class MemberVo {
 String id;
 String password;
 String name;
 int age;
 String sex;
 String tel;
 
 public String getId() {
  return id;
 }
 public void setId(String id) {
  this.id = id;
 }
 public String getPassword() {
  return password;
 }
 public void setPassword(String password) {
  this.password = password;
 }
 public String getName() {
  return name;
 }
 public void setName(String name) {
  this.name = name;
 }
 public int getAge() {
  return age;
 }
 public void setAge(int age) {
  this.age = age;
 }
 public String getSex() {
  return sex;
 }
 public void setSex(String sex) {
  this.sex = sex;
 }
 public String getTel() {
  return tel;
 }
 public void setTel(String tel) {
  this.tel = tel;
 } 
}

위와 같은 bean을 만듭시다.

그리고 DB와 연동하는 놈인 MemberService라는 클래스를 만들어봅시다.

package flex.member;

import java.util.ArrayList;
import java.util.List;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import flex.member.MemberVo;
public class MemberService {
 public List<MemberVo> getElements() throws SQLException {
  long startTime = System.currentTimeMillis();
  try {
   Class.forName("com.mysql.jdbc.Driver");
  } catch (ClassNotFoundException e) {
  }
  Connection con = null;
  List<MemberVo> list = new ArrayList<MemberVo>();
  String sql = "SELECT * FROM Member_List";
  try {
   String url = "jdbc:mysql://MYSQL디비주소/db이름";
   con = DriverManager.getConnection(url, "db계정id", "db계정비밀번호");
   PreparedStatement stmt = con.prepareStatement(sql);
   ResultSet rs = stmt.executeQuery();
   while (rs.next()) {
    MemberVo mb = new MemberVo();
    mb.setId(rs.getString("Id"));
    mb.setPassword(rs.getString("Password"));
    mb.setName(rs.getString("Name"));
    mb.setAge(rs.getInt("Age"));
    mb.setSex(rs.getString("Sex"));
    mb.setTel(rs.getString("Tel"));
    list.add(mb);
   }
  } catch (SQLException e) {
   e.printStackTrace();
  } finally {
   try {
    con.close();
   } catch (Exception ignored) {
   }
  }
  System.out.println("Service execution time: "
    + (System.currentTimeMillis() - startTime));
  return list;
 }
}

다 만들었으면 config를 수정해야해요.
blazeds프로젝트아래 WebContent/WEB-INF/flex/remoting-config.xml를 열어봅시다. service태그 안에 추가합시다.

<destination id="member">  
  <properties>   
   <source>flex.member.MemberService</source>  
  </properties> 
 </destination>

이제 다 완성되었어요. export를 해야죠. Overwrite existing file에 체크를 하고, 톰캣디렉토리/webapp/blazeds.war를 선택합니다.
Finish를 클릭하고 톰캣을 가동시켜줍시다.

이제 Flex Builder로 갑시다. 여기서 이제 저 MemberService클래스에 있는 getElements()메소드를 불러올꺼에요.
New Project에서 Flex Project를 선택합니다.
Project name은 BlazedsTest라고 하고 Web application선택, Application server type은 J2EE로 선택하고 다음!
Server location에서 User default ~~~ 어쩌구 체크해제하구 blazeds로 설정합시다.
Root folder는 톰캣디렉토리/webapps/blazeds를 선택
Root URL은 http://localhost:8080/blazeds/
Context root는 blazeds
Validate Configuration클릭해서 제대로 되면 돼요(톰캣이 가동되어 있어야 돼요 ^^)
가볍게 Finish를 눌러줍시다 ^^

BlazedsTest.mxml에 이렇게 작성합시다.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 <mx:Script>  
  <![CDATA[   
   import mx.rpc.events.ResultEvent;   
   import mx.rpc.events.FaultEvent;   
   import mx.rpc.remoting.RemoteObject;   
   import mx.controls.Alert;      
   private var startTime:Number;       
   private function resultHandler(event:ResultEvent):void{        
    dg.dataProvider = event.result;   
   }      
   
   private function faultHandler(event:FaultEvent):void{        
    mx.controls.Alert.show("실패 메세지 : " + event.fault.message);   
   }      
   
   private function retrieve():void  {   
    var srv:mx.rpc.remoting.RemoteObject = new RemoteObject();   
    srv.destination = "member";       
    startTime = new Date().time;   
    srv.getElements();        
    srv.addEventListener("result",resultHandler);   
    srv.addEventListener("fault",faultHandler);   
   }     
   
   private function logResult():void  {   
    if (startTime > 0)   {    
     log.text = "" + (new Date().time - startTime) + " milliseconds";  
    }  
   }    
  ]]> 
 </mx:Script>   
 
 <mx:Panel title="AS를 이용한 RemoteObject예" width="100%" height="100%">  
  <mx:DataGrid id="dg" width="100%" height="100%"                  
      updateComplete="logResult()"/>   
  <mx:ControlBar>    
   <mx:Button label="데이터 가져오기" click="retrieve()"/>   
   <mx:Label id="log"/>   
  </mx:ControlBar> 
 </mx:Panel>
</mx:Application>

그런다음 실행하면 아래와 같은 창이 뜨고 Button클릭하면 끝입니다.


이렇게 하는게 맞나-_-; 아닌것같아요. 너무 복잡해요-_-; 더 쉬운방법이 있을것같은데...-_-;

BlazeDS는 기존에 FDS(LCDS)에서 Remoting, Messaging기능만 빼서 오픈소스화한 프로젝트랍니다.
RemoteObject를 그니까 LCDS를 사지않고도 사용할 수 있다는 거란얘기죠-_-;
어쨌든 간단한 예제로 해봅시다.

http://opensource.adobe.com/wiki/display/blazeds/Downloads
이곳에서 BlazeDS를 받도록 합시다.
압축을 적당한 곳에다가 풀어놓습니다.

여기 안에 톰캣이 있긴 있는데 이걸로 이클립스에 서버를 추가하려니 안되더라구요. 그래서 톰캣을 새로 받아서 lib만 추가하는 식으로 하니까 되더군요 ^^
톰캣을 받습니다. http://tomcat.apache.org/ 6.0으로 받습니다. zip파일로 받습니다.
적당한 곳에 풀어버립시다.
그리고 BlazeDS디렉토리/tomcat/lib/blazeds/에 있는 jar파일 2개를
톰캣홈디렉토리/lib폴더에다가 jar파일을 복사해야해요.(flex-tomcat-common.jar, flex-tomcat-server.jar)
이거 복사하는 것도 안해줘도 됩니다 ㅠ

그리고 blazeds.war, blazeds-console.war, blazeds-samples.war 파일을 톰캣디렉토리/webapps/ 에다가 복사를 합니다.
톰캣디렉토리/bin/startup.bat 를 실행해서 구동되는지 확인합니다. 구동되면 된 겁니다 ^^

이제 Flex Builder 3 beta 3이 필요합니다.
참고로 standalone모드로 설치를 해야합니다.
베타 때 문제가 있었던 것 같은데 개발할 때에는 플러그인으로 빌더를 설치하는게 정신건강에 좋습니다.

플러그인으로 설치를 하면 자꾸 Builder가 죽어버리네요-_-;
그래서 그냥 Builder, Eclipse 따로따로 사용해서 했습니다.

Eclipse(WTP)를 실행해봅시다.

BlazeDS디렉토리/blazeds.war파일이 있는데 이것을 이클립스에서 Import시켜봅시다.
File -> Import -> WAR file선택합시다.
WAR file은 blazeds.war선택.
Target runtime은 New해서 새로 추가해줍시다.
우리가 설치한 톰캣을 추가해봅시다.
Apache Tomcat v6.0을 선택하고, 디렉토리는 설치한 톰캣디렉토리를 지정해줍시다.
Finish를 클릭해서 완료합니다. war파일을 불러왔네요. 이제 간단히 DB연동을 해서 데이터를 가져오는 메소드를 만들어 봅시다.
이 메소드를 이제 Flex에서 RemoteObject로 호출할꺼니까요 ^^

소스설명은 다음이시간에-_-;