• 어플리케이션 구조
• 가젯 xml파일 동작 및 생성
• 백엔드서버 동작
• 프레임워크의 DB연동 방법

어플리케이션은 크게 오픈소셜사이트의 가젯을 표현하는 xml파일과 사용자정보 및 어플리케이션의 로직을 담당하는 백엔드서버로 구성되게 됩니다.

▶ 동작과정

1. 가젯을 표현하는 html파일 생성을 위한 스타일및 백엔드서버와의 통신, 로직을 처리하는 javascript파일들을 백엔드서버로부터 받아온다.
2. 매개 페이지들을 표현하는 클래스들에 대한 초기화를 진행한다.(우리가 작성한 가젯에서는 매개페이지당 한 개의 클래스를 대응시켰다.)
3. 로그인 된 사용자인지를 판단하고 로그인하지 않은 사용자라면 로그인창으로 이동시킨다.
4. 로그인 된 사용자라면 viewer의 프로필정보를 가져온다.
5. 이때 viewer가 '너는 펫' 가젯을 설치하지 않았다면 설치 할 것을 요구하는 메세지를 띄운 후 가젯추가 페이지로 이동시킨다.
6. 오픈api를 이용하여 오픈소셜사이트로부터 viewer의 thumbnail을 가지고 온다.
7. 백엔드서버로부터 template파일들을 가지고 온다.(template파일은 가젯이 한 개의 html파일 즉 xml파일로 구성되므로 여러개의 페이지로 구성되는 경우 그 한 개의 xml 파일에 이 페이지들을 다 넣을수 없으므로 필요한 파일이다. 그리고 개발의 확정성과 보수성을 높이기 위하여 백엔드서버로부터 정적페이지들을 불러들여 출력하도록 하는 파일이다.)
8. 해당 페이지가 프로필페이지인지 캔버스페이지인지를 판단하고 프로필페이지일 경우 Dashboard클래스를 로딩하여 출력한다.
9. 캔버스페이지인 경우 파라메터를 확인하여 홈페이지(클래스:Home)와 선물보내기페이지(클래스:GiftShop)들을 각각 로딩하여 화면에 출력한다.

▶ 해당 페이지를 표현하는 클래스의 페이지 생성방법

1. 매개 클래스는 모두 load함수와 draw함수를 가지고 있다. load함수는 페이지를 구성하기 위한 인자(Data)들을 백엔드서버에서 얻은 기초로 draw함수를 호출함으로써 페이지를 출력한다.
2. Draw함수
   • 해당 페이지를 표현하는 template내용을 로딩한다.
   • 페이지를 출력하기 위한 기본자료들과 template을 서로 결합하여 한 개의 동적페이지를 구성한다. 여기 template의 매개 변수들은 다음과 같이 표현된다.
     
     ${변수이름} (velocity의 동작과정과 비슷함)
3. 백엔드서버로에서 데이터 불러오기
   • 백엔드서버로 다음과 같은 액션을 취한다.
     
     백엔드서버/urpetservlet?action=액션이름&module=모듈이름&파라메터1=값1&파라메터2=값2

백엔드서버는 크게 dao단과 biz단으로 나누어진다. dao단은 DB와의 연동을 직접 담당하는 부분이고 biz단은 어플리케이션의 로직을 담당하는 부분이다. 즉 biz단에서 dao단을 이용하게 된다.

백엔드서버 동작과정은 다음과 같다.

1. 가젯으로부터 urpetservlet 서블렛 액션이 받으면 ActionServlet의 doGet,doPost함수에서 처리된다.
2. 다음 액션URL로부터 파라메터를 분석하고 action파라메터에 따라 로직들을 처리한다.
3. 해당 로직들에서는 우리가 정의한 HSingleDAO를 이용하여 DB에 접근한다.
4. 이때 DB 컨넥션풀링객체를 이용하여 DB와의 연동을 진행한다.
5. 로직들을 처리한 후 얻은 값들을(가젯으로 보낼 데이터) JSON형태로 만들어 response객체에 보낸다. (가젯에서는 백엔드서버로부터 자료를 얻어오는 경우 모두 JSON형태로 받아 처리한다.)

1. DB로부터 데이터를 가져오기 위해 한 개의 DAO객체를 생성한다.(가젯에서는 프레임웍크에 정의된 HSingleDAO를 사용하였다.)
   
   HSingleDAO dao = new HSingleDAO( queryPath, params );
   dao.execute(); //Update 혹은 Insert into쿼리를 실행할때
   /* dao.executeQuery(); //Select 쿼리를 실행할때 */
   queryPath : filename.queryname
   params : HRecord형으로서 쿼리에서 사용될 변수들이 저장된다.
   Params.put(“id”, “kjustin88”);
   
   
2. DAO를 사용하여 실행시킬 쿼리를 xml파일에 저장한다. 이때 xml파일은 webapp/env/sql/에 위치하게 된다. Query정의방식은 다음과 같다.
   
   <Querys>
   <QUERY name=”getUserInfo”>
   SELECT * FROM id=${id} AND num=#{num}
   {#1} {#2}
   <case when=”${var1}(>=)${var2}” id=”#1”>
   AND date < ${var1}
   </case>
   <case when=”${var3}(NOTEMPTY)” id=”#2”>
   AND name = ${var3}
   </case>
   </QUERY>
   </Querys>
   
   ${id}, #{num} : DAO생성시 파라메터로 넘어가는 변수이름이다.
   ${var} 는 ‘exam’ 형태로, #{var} 는 exam형태로 Query에 대응된다.
   case문은 생략할수도 있으며 작성하는 경우 2개의 변수사이에 들어가는 연산자는 일반 론리연산자와 같다.
   
   
3. DAO를 실행시킨 후 얻어지는 쿼리실행결과는 HRecordSet로 받는다. HRecordSet는 HRecord들의 집합으로 구성된다.

너는펫 가젯 메인화면

■ Client :

• OS : Linux / Windows 2003
• Framework : JDK, TOMCAT, JSP Model1
• Language : JAVA, JSP
• Database : MYSQL 5.0

안철수연구소 아이디테일에 마이템 가젯 개발
• HTML, JAVA Script, XML로만 이루어진 형태의 가젯으로 Open Social API를 이용하여 Back and Service 와 통신을 하고 Back and Service 의 결과를 받아서 새로운 페이지를 만들어 화면에 Display 한다.
• Idtail에서 제공하는 Open API를 이용하여 Idtail과 유기적으로 연결된다.

BACK AND SERVICE 사이트개발
• JSP 모델1을 이용한 사이트로 가젯에 호출에 의하여 DB 데이터를 XML로 만들어 가젯에 전송하거나 가젯의 요청에 의해서 DB에 반영한다.

• 일종의 가젯 게임으로 Idtail에 친구정보및 회원경로를 받아서 그 정보를 아바타 형식으로 상품화하여 경매진행 방식으로 다른 회원들에게 팔고 사는 형식이다. 회원간 모르는 사람에게 쉽게 접근 할 수 있고 정보교류도 가능하다. 팔고 사는 차익으로 친구들에게 간단한 선물 아이템을 구입하여 선물해 주는 기능도 있다. Idtail 사이트의 활성화 및 회원간 유기적인 관계증진을 목적으로 개발되었다.