overview of dwt

15
Copyright All Right Reserved by shinpro Overview Of DWR JAVA 를 를를 를를 AJAX Open Source 12:45 Member Otthry 1

Upload: inyoung-lee

Post on 31-May-2015

256 views

Category:

Education


4 download

DESCRIPTION

Overview of Dwt

TRANSCRIPT

Page 1: Overview of Dwt

1Copyright All Right Reserved by shinproⓒ

Overview Of DWR JAVA 를 위한 쉬운 AJAX Open Source

12:45 Member Otthry

Page 2: Overview of Dwt

2Copyright All Right Reserved by shinproⓒ

INDEX POWERPOINT PROFESSIONAL SHINPRO

POWERPOINT PROFESSIONAL SHINPRO

POWERPOINT PROFESSIONAL SHINPRO

Page 3: Overview of Dwt

3

DWR 은 JavaScript 에서 Java Function 을 Java 에서 JavaScript Function 을 쉽게 호출 가능하도록

만들어 주는 RPC 라이브러리 (library) 이다 .

Copyright All Right Reserved by shinproⓒ

Page 4: Overview of Dwt

4Copyright All Right Reserved by shinproⓒ

DWR 의 특징

- 배치를 실행 (call batching)- Java 와 JavaScript 사이의 ( 바이너리 파일 업로딩 , 다운로딩을 포함한 ) 어떤 임의의 data structure 를 전송- 예외 처리 (exception handling)- 향상된 CSRF(Cross-Site Request Forgery) 방지- Spring 과 Guice 같은 Java 서버 사이드 기술들과의 통합성

Page 5: Overview of Dwt

5

다이어그램 1.JavaScript 이벤트를 통해 select list 의 컨텐츠 변경

Data=AjaxService.getOption()

Page 6: Overview of Dwt

6

다이어그램 2서버에서 실행되는 Java 코드로부터 클라이언트 단에서 보여지는 페이지내로 JavaScript 를 보내는 것을 허용

Page 7: Overview of Dwt

7Copyright All Right Reserved by shinproⓒ

DWR 의 구성1. 서버상에서 구동되는 Java Servlet - request 를 처리하

고 , 브라우져로 response 를 되돌려 보낸다 .

2. 브라우져상에서 구동되는 JavaScript - request 를 보내고 , 이를통해 웹페이지의 동적 업데이트가 가능하다 .

Page 8: Overview of Dwt

8Copyright All Right Reserved by shinproⓒ

DWR 은 Java class 에 기반한 동적으로 생성된 JavaScript 에 의해 동작한다 . 이 코드는 브라우져상에서 실행되는 것 처럼 느끼게 해준다 . 하지만 실제로는 코드를 서버에서 실행하고 DWR 은 Data 의 전송을 담당한다 .이 Java 로부터 JavaScript 로의 원격 함수 (remote function) 호출 방식은 DWR 사용자에게 RMI 와 SOAP 과 같은 전통적인 RPC 메카니즘과 같은 느낌을 주며 , 웹브라우져 플러그인 없이 웹을 통해 실행되는 이익을 준다 .

Page 9: Overview of Dwt

9Copyright All Right Reserved by shinproⓒ

DWR 테스트 환경 설정 및 구현

0. 프로젝트를 만든다 . 프로젝트 이름을 “ TestProject“ 로 예시 .

1. dwr.jar 를 다운 (http://directwebremoting.org/dwr/download)

2. 3.0.0 버전에 필요한 jar 파일 다운로드-- maven 의 경우 dependency 추가 (10page 참고 )3. 다운로드 받은 jar 파일 해당 프로젝트 WEB-INF/lib 에 복사4. 프로젝트 Refresh (Web App Libraries 라는 디렉토리 생성 학인 )

5. WEB-INF/web.xml 에 서블릿 추가 (11page 참고 )

6. WEB-INF/ 에 dwr.xml 이란 파일을 추가시키고 아래 내용을 입력한다 .

(12page 참고 )

7. 새로운 클래스를 추가- Package : dwrtest - Name : HelloName

8. HelloName.java 작성 (13page 참고 )

9. index.jsp 수정 (14page 참고 )

Page 10: Overview of Dwt

10Copyright All Right Reserved by shinproⓒ

<dependency> <groupId>org.directwebremoting</groupId> <artifactId>dwr</artifactId> <version>3.0.0-rc3-SNAPSHOT</version>

</dependency> <dependency>

<!-- Optional non-CLA components see DWR documentation for details --> <groupId>org.directwebremoting</groupId> <artifactId>dwr</artifactId> <classifier>noncla</classifier> <version>3.0.0-rc3-SNAPSHOT</version>

</dependency> <repositories>

<repository> <!-- Please consider setting up your own on-site repository proxy such as with Nexus and pointing the url element below at that instead --> <id>oss-sonatype-snapshots</id> <name>OSS Sonatype Snapshots Repository</name> <url>http://oss.sonatype.org/content/repositories/snapshots</url> <releases><enabled>false</enabled></releases> <snapshots><enabled>true</enabled></snapshots> </repository>

</repositories>

maven 의 경우 dependency 추가

Page 11: Overview of Dwt

11Copyright All Right Reserved by shinproⓒ

<servlet>

<servlet-name>dwr-invoker</servlet-name>

<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>

<init-param>

<param-name>debug</param-name>

<param-value>true</param-value>

</init-param>

</servlet>

<servlet-mapping>

<servlet-name>dwr-invoker</servlet-name>

<url-pattern>/dwr/*</url-pattern>

</servlet-mapping>

web.xml 에 서블릿 추가

Page 12: Overview of Dwt

12Copyright All Right Reserved by shinproⓒ

<!DOCTYPE dwr PUBLIC

"-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"

"http://getahead.org/dwr/dwr20.dtd">

<dwr>

<allow>

<create creator="new" javascript="Hello">

<param name="class" value="dwrtest.HelloName"/>

</create>

</allow>

</dwr>

생성한 dwr.xml 파일에 내용 추가

Page 13: Overview of Dwt

13Copyright All Right Reserved by shinproⓒ

package dwrtest;public class HelloName {public String getHelloName(String name){if(name == null || name.trim().length() < 1){return "Hello~! John Doe.";}return "Hello~! " + name + ".";}}

HelloName.java

Page 14: Overview of Dwt

14Copyright All Right Reserved by shinproⓒ

<html><head><title>DWR Test</title>

<script type="text/javascript" src='http://localhost:8081/dwr/interface/Hello.js'></script><script type="text/javascript" src='http://localhost:8081/dwr/engine.js'></script><script type="text/javascript">

function update() {var name = document.getElementById("myname").value;Hello.getHelloName(name, loadinfo);}

function loadinfo(data) {document.getElementById("replytext").innerText = data;}

</script></head><body><p>Name:<input type="text" id="myname"/><input value="Send" type="button" onclick="update()"/><br/>Reply: <span id="replytext"></span></p></body></html>

Index.jsp

Page 15: Overview of Dwt

15

감사합니다 .

Copyright All Right Reserved by shinproⓒ