2013년 4월 18일 목요일

[Spring] DWR

웹을 이용하다보면 사용자에게 편리하고 유용한 기술이 Ajax란 것을 느낄 수 있다. 그렇지만 동시에 개발자에게는 번거로운 작업이기도 하다. 자바스크립트에서 이벤트를 발생시키고 필요한 데이터를 서버에 전송하여 원하는 결과 값을 json이나 다른 형태의 데이터 포맷으로 가져오는 것이 단순히 웹을 리로딩시키는 것보다는 할 일이 많기 때문이다.

그런데 스프링에서는 굉장히 유용한 기술이 있다. DWR이 그것이다. DWR(Direct Web Remote)은 Ajax를 이용해서 자바스크립트에서 원격으로 서버의 자바객체를 호출할 수 있도록 해주는 자바 기반의 RPC라이브러리다. 자바스크립트에서 자바의 메서드를 호출한다는 것만으로도 대단한 기술이다.

또한 DWR은 서버 측의 결과 객체를 JSON형식으로 변환해 주기 때문에 더더욱 편리하다!

그렇지만 처음 사용하는 것 역시 어려움이 따르므로 어떠한 순서로 DWR을 적용시켜나가는지 살펴보도록 하자.

우선 dwr.jar라이브러리가 필요하다. dwr.jar파일을 추가하면 관련 코드를 xml에 추가해 주어야한다.

xmlns:dwr="http://www.directwebremoting.org/schema/spring-dwr"
http://www.directwebremoting.org/schema/spring-dwr
http://www.directwebremoting.org/schema/spring-dwr-2.0.xsd

xml설정 파일에는 자바스크립트로부터의 요청을 처리할 DWR컨트롤러를 <dwr:controller>태그를 이용해 설정해주어야한다. 그리고나서 컨트롤러가 처리할 요청에 대해 매핑이 필요한데 자세한 코드는 다음과 같다.

<!-- DWR Setting -->
<dwr:controller id="dwrController" debug="true">
<dwr:config-param name="crossDomainSessionSecurity" value="false"/>
</dwr:controller>
<bean id="handlerMapping" class="org.springframework.web.servlet.handler.SimpleUrlHandlerMapping">
<property name="alwaysUseFullPath" value="true"></property>
<property name="mappings">
<props>
<prop key="/dwr/engine.js">dwrController</prop>
<prop key="/dwr/**/*">dwrController</prop>
</props>
</property>
</bean>
<bean id="handlerMapping2" class="org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping"></bean>

톰켓 7버전부터 단순히 <dwr:controller>를 이용한 컨트롤러 설정이 되지 않는다. 그 이유는 세션 보안과 관련한 문제를 발생시키기 때문이다. 그래서 <dwr:config-param>태그에 속성을 위와 같이 설정해 주어야한다.

그 다음으로 핸들러 매핑 객체를 만들고 있다. dwr을 사용하기 위해서 SimpleUrlhandlermapping클래스를 이용하여 핸들러를 사용할 것이다. 특히 <prop>태그에 경로를 항상 engine.js가 필요하다는 것을 명심해야 한다.

마지막으로 한가지 설정해주어야 할 것이 남았다. 지금까지 스프링을 활용하여 웹 어플리케이션을 제작하면서 @어노테이션 방식으로 컨트롤러를 등록하고 응답에 대한 핸들러를 등록하는 등 많은 설정을 처리해 주었는데 위와같이 SimpleUrlhandlerMapping이라는 매핑을 따로 설정해 줌으로써 기본적인 어노테이션 핸들러 매핑도 함께 설정해 주어야한다. 이렇게 해야만 기존에 사용하고 있던 어노테이션 설정을 변함없이 사용할 수 있으므로 꼭 기억해두자.

마지막 설정으로는 자바스크립트와의 실제 데이터를 주고 받을 클래스인 Dwr 객체를 만들어 주고 이 Dwr을 자바스크립트에서 사용할 수 있도록 <dwr:remote>라는 원격 태그를 지정해 준다. 

        <dwr:configuration>
<dwr:convert type="bean" class="kosta.model.Admin"></dwr:convert>
</dwr:configuration>
<bean id="adminDwr" class="kosta.dwr.AdminDwr">
<property name="admindao" ref="adminDao"></property>
<dwr:remote javascript="adminDwr"></dwr:remote>
</bean>

우선 <dwr:configuration>태그를 이용하여 자바객체를 원하는 형태로 변경할 수 있다. 위에서 보면 Admin클래스를 bean객체로 변환하라는 의미이고 dwr에서는 변환된 bean객체를 다시 JSON으로 변환하여 자바스크립트로 보낼 것이다.
<dwr:remote>태그를 보면 javascript속성을 확인 할 수 있는데 이 속성에 adminDwr이란 값을 넣어주었다. 이렇게 함으로써 자바스크립트에서는 adminDwr로 Dwr과 데이터 교환이 가능하다.

<script type="text/javascript" src="/spring_dwr_practice/dwr/engine.js"></script>
<script type="text/javascript" src="/spring_dwr_practice/dwr/interface/adminDwr.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
adminDwr.adminList(show);
function show(data){//결과값이 도착하면 자동으로 호출되는 콜백함수
$.each(data, function(index, member){
var html = "<tr><td>" + member.mem_id + "</td><td>" + member.mem_name + "</td></tr>";
$("table tbody").append(html);
});
}
});
</script>

이제 자바스크립트에서 dwr을 호출할 수 있게 되었다. 먼저 <script>에 xml에서 컨트롤러에게 매핑해 주었던 engine.js와 javascipt에서 지정한 adminDwr라는 이름의 js도 지정해 주도록한다. 이렇게 프로젝트 경로로 매핑을 시킨 것이 SimpleUrlHandlerMapping방식이다.

이렇게 설정이 다 되었으면 이제부터 단순히 자바스크립트 코드에 adminDwr을 이용하여 AdminDwr클래스에 존재하는 메서드나 멤버변수를 호출할 수 있다.

adminDwr.adminList(show) 는 AdminDwr클래스의 adminList함수를 호출하는 것이고 인자로 show라는 함수를 넣어준다는 것을 기억하자. show함수는 콜백함수로써 adminList()메서드의 결과값을 자동적으로 리턴받아 처리할 수 있다. 이때 얻은 결과값은 앞서 언급했던 JSON데이터 포맷을 가지고 있음으로 키와 값으로 데이터를 접근할 수 있다.

댓글 없음:

댓글 쓰기