머드초보의 블로그

플렉스로 만들기는 했지만, 뭐 모든 클라이언트 플랫폼에서 쉽게 만들 수 있습니다.

요아래에 있는 RESTful Web Service를 구축하셨다면 그것을 이용한 클라이언트가 필요할 것입니다.

게시판용 RESTful WebService만들기
http://mudchobo.tomeii.com/tt/345
http://mudchobo.tomeii.com/tt/346

그래서 구현해봤습니다.
우선 5가지 요청을 합니다.

1. 게시물 리스트를 받아오는 것(GET)
2. 게시물 1개의 데이터를 받아오는 것(GET)
3. 게시물 쓰기(POST)
4. 게시물 삭제(DELETE)
5. 게시물 수정(PUT)

핵심은 RESTful요청이 가능한 라이브러리입니다. 요아래를 참고하세요~

[Flex/AIR] RESTful WebService를 위한 Flex RestService Library!

이 라이브러리를 통해 RESTService요청을 합니다. (기존 Flex에 있는 HTTPService는 DELETE와 PUT이 안됩니다.)

<rest:RESTService id="boardService" method="GET" 
        rootURL="http://localhost/BoardWS/resources/wsboards/" port="9080" 
        result="resultBoardHandler(event)" fault="faultHandler(event)"/>

이런식으로 요청하면 되겠죠? ^^

아래는 구현체 소스입니다.
허접해서 도움이 될지는 모르겠지만....-_-; 어쨌든 저의 삽질의 결정체니....-_-;

저 위에서 구현한 WebService를 띄워놓고, 이 클라이언트로 접속하면 잘 될겁니다.

우선 RESTFul로 구현된 WebService를 Flex에서 호출하기 위해서는 클라이언트에서 method방식이 GET, POST, DELETE, PUT을 지원을 해야합니다. 근데, 제가 RESTful WebService를 만들었는데요. 만들어놓고, 자체 GlassFish에서 제공하는 RESTful WebService Test로는 무쟈게 잘 돌아갔습니다.
근데, Flex에서 제공하는 HTTPService를 이용해서 method는 DELETE로 놓은다음에 http요청을 해봤습니다. 이게 왠걸......POST로 요청이 되는 듯해서 데이터를 가져오고 있습니다-_-; 지워야하는데!

그래서 검색을 해보니.......
http://verveguy.blogspot.com/2008/07/truth-about-flex-httpservice.html
저의 짧은 영어실력으로 보니.......

4/ All HTTP PUT and HTTP DELETE requests are turned into POST requests. This appears to be a browser limitation that the Flash player is stuck with.

라고 되어있군요. PUT과 DELETE는 POST로 요청이 된다고 하는 것 같습니다. 플래쉬플레이어가 브라우저 제한에 뭐 걸린 것으로 보인다고 말하는데요. 해석이 잘 안되네요-_-;

그래서! 검색해본 결과 REST요청을 위한 라이브러리를 누가 만들었더군요. 대단합니다 ^^ 어차피 HTTP요청도 해당 포트로 뭐 데이터를 주고 받는 것이다 보니, 이것을 소켓으로 구현을 했더군요.

http://lab.arc90.com/2008/03/restservice.php

기존 HTTPService랑 틀린 것이...얘는 소켓을 통해서 쏘기 때문에 포트를 지정해줘야합니다. 그리고 arc90에서 만든 ResultEvent랑 FaultEvent를 사용해야합니다.

서버측 코드를 보면

@DELETE
    public Response delete() {
        PersistenceService persistenceSvc = PersistenceService.getInstance();
        try {
            Wsboard entity = getEntity();
            if (entity.getPwd().equals(pwd))
            {
                persistenceSvc.beginTx();
                persistenceSvc.removeEntity(entity);
                persistenceSvc.commitTx();
                
                return Response.ok("success").build();
            }
        } finally {
            persistenceSvc.close();
        }
        return Response.ok("fail").build();
    }

그냥 단순히 비밀번호가 같으면 지워서 응답을 success로 주고, 틀리면 fail로 줍니다.

이제 플렉스에서 봅시다.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute"
    creationComplete="init()" xmlns:rest="com.arc90.rpc.rest.*">
    
    <mx:Script>
        <![CDATA[
            import com.arc90.rpc.events.FaultEvent;
            import com.arc90.rpc.events.ResultEvent;
            import mx.controls.Alert;
            
            private function init():void
            {        
                service.send();                
            }

            private function result(event:ResultEvent):void
            {
                Alert.show(event.result.toString());
            }    
            
            private function fault(event:FaultEvent):void
            {
                Alert.show(event.fault.toString());
            }        
        ]]>
    </mx:Script>
    <rest:RESTService id="service"
        port="9080" url="http://localhost/BoardWS/resources/wsboards/22/1"
        result="result(event)" fault="fault(event)" method="DELETE">
    </rest:RESTService>
    
</mx:WindowedApplication>

포트를 port라고 해서 따로 지정해줍니다.
저 웹서비스가 {idx}/{pwd} 형식의 url을 요청합니다. DB에는 22번의 idx를 가지고 pwd가 1인 데이터가 있습니다. 저렇게 요청하면 지워집니다.

ps. 정말 적절하지 못한 웹서비스군-_-;

이건뭐 설명이 필요없네요.
아까 전시간에 만든 WebService를 호출해봅시다.

전시간에 만들어 놓은 웹서비스
http://mudchobo.tomeii.com/tt/328

플렉스빌더를 실행합니다.
Air로 프로젝트를 하나 만듭니다.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="vertical">
    
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            
            private function callWebService():void
            {
                helloWebService.sayHello(input.text);
            }
            
            private function resultHandler(event:ResultEvent):void
            {
                Alert.show(event.result.toString());    
            }
            
            private function faultHandler(event:FaultEvent):void
            {
                Alert.show(event.fault.message);    
            }
        ]]>
    </mx:Script>
    
    <mx:WebService id="helloWebService"
        wsdl="http://localhost:9080/HelloWebApp/HelloService?WSDL"
        useProxy="false"
        result="resultHandler(event)"
        fault="faultHandler(event)" />
        
    <mx:TextInput id="input" enter="callWebService()"/>
    <mx:Button id="button" label="Button" click="callWebService()"/>
        
</mx:WindowedApplication>

wsdl부분에서만 주소를 WSDL파일 주소로 써주세요.
그 외에는 RemoteObject나 HTTPService와 같이 같은 방식으로 해주면 돼요.

다음엔 RESTful이 뭔지 좀 알아봐야겠습니다.