'2008/04'에 해당되는 글 9건

파란만장한 친구의 여정 후, 긴긴 휴식을 가지다가, 결국 참지 못하고
내지른 새로운 직업. 세.탁.소 주인.
워낙에 딱부러지는 친구다 보니, 이래저래 알아서 잘 쟀으리라 생각은 되지만,
그에 앞서 다급한 마음에 실수나 하지 않았나 우려감도 없지 않아 있다.

그리고 그 일을 시작한 첫날(정확히는 둘째 날이겠지만. )
시스템 파악에 정신 없는지, 이래저래 맞추고 확인하는 듯 했다.
물론 내 일이 우선인지라 일하다가 중간에 받은 전화나 메시지 보면,
그런가 싶다.

적성이나 특기는 이차 문제.
오랫동안 지긋이 그 일을 수행하는 것이 중요할 것 같다.
이래저래 바쁜인생.. 잘 돼야 될텐데.

몸개그

예전에 Javascript 예제 소스를 받기위해 이곳 저곳을 들리다가, Javascript 안에서

  MOA.Service.Open("aaaaa", "12"."55");

식으로 소스를 적어놓은 것을 보았다.
처음에는 무슨 Object를 New 한뒤, 그 안의 메소드가 그렇게 된 줄 알았는데,
Javascript를 구성할 때, Namespace 기반으로 마치 Class 처럼 구현하는 방법으로
만들어 진 것이였다.
지금도 그렇지만 그 당시 나에게 Javascript는 넘지 못할 산이였고, Copy & Paste만 한채
더 이상 분석 없이 그냥 넘어 갔었다.

이번에 AJAX 기반의 WebPart를 만들면서 Javascript를 하나씩 사용하기 시작했는데,
그 때 보아왔던 Class 처럼 구현한 Javascript 의 원형을 보게 되었고, 그 구조를 뜯어보는
기회를 갖게되었다.


Javascript 에서 저런 "." 으로 구분된 형태로 구성하는 이유중에 하나는,
Namespace 때문이다.
예를 들어 함수나 변수 이름들을 넣을 때,  이름이 겹치지 않을까 하는 우려가 발생했다.
예를 들어 addNode 라는 함수를 만들었는데, 이 함수가 다른 Javascript에서도 사용하지
않을까... 라는 우려감이 그대로 드는 것이였다. 그럼 어떻게 해결 할까?

Javascript에서는 var 라는 변수 형에는 뭐든지 들어갈 수 있다는데 착안을 하여 구성한 것 같다.

즉 var AAA = { 'aaa', 'bbbb'  ,'cccc'  } 라는 배열을 넣듯이 그 안에 구성요소들을 때려
넣는 것이다. 이 때 name과 value라는 형태로 넣는데, 굳이 표현하면 아래와 같이 된다.

var AAA = { name : 'aaaa', tel : 'bbbbb' , addr : 'cccc' }

요소 1개는 name : 'aaaa' 이고, 2번째 요소는 tel : 'bbbbb' , 3번째 요소는 addr : 'cccc' 를 의미하게 된다. 만일 'aaaa' 라는 것을 접근하려면, AAA.name 으로 하면 'aaaa' 이 나오게 되는 것이다.

예를 들면 아래와 같이 클래스를 구성하게 된다.

var HelloClass = {
       variableA : null,
       RunIt: function (param) {
            this.variableA = param;
            alert(HelloClass .variableA);
       }
}

HelloClass.HelloMethod('OK!');

위의 자바 스크립트를 실행하면 'OK!' 라는 Alert 창이 뜬다.

잠시 위의 코드를 살펴보자.
보면, 이름과 그 형이나, 값을 ':' 으로 구분하여 구성한다.
보면 변수 부분은 변수이름을 variableA 로, 그 값은 null 로 규정했다.
그리고 함수 부분은 이름을 RunIt로, 그 값은 function(....) {....} 이라고 규정했다.

이렇게 만들면 저 맨위의 이름(예에서는 HelloClass )만 안겹치면 끝이다.

그리고, HelloClass를 접근할 때, HelloClass 자체를 써서 접근할 수 있고,
HelloClass 내부에서 접근할 땐 this라는 지시어를 써도 된다.

뭐 실제 class 처럼 proecteed, private 등의 접근 제어나 생성자 이런 부분이
명확치 않아서 의미가 별로 없긴 하지만, 네임 스페이스에 겹치지 않는 문제를
해결한다는 입장에서 볼때는 획기적인 방법이 아닐 수 없다.

정규식 표현(Regular Expressions) 작업은 다양한 텍스트 작업에 필수 이지만, 그 문법을 익히기엔 귀찮고 시간도 부족하고 특이한 형태를 뽑아내려면 많은 고민과 테스트를 해야 한다.
그렇다고 Window App로 만들어서 이런저런 테스트하기도 귀찮고..

그런 부분을 아는지 외국 사이트 중 이작업을 보다 수월하게 도와주는 곳이 있었다.

http://regexlib.com 

다행이 유료는 아니였다. 여러 난다 긴다는 분들이 자신만의 Expression들을 등록해 마치 라이브러리 처럼 유지되고 있었다. 일단 훌륭하게 운영되는 곳 같다.

게다가 이 사이트내에는 이 Expression을 테스트할 수 있는 도구도 제공한다.

http://regexlib.com/RETester.aspx

여기에 자신의 예제 텍스트들과 Expression을 넣고 돌리면 그 결과값을 볼 수 있다!!!
쵝오!

요즘 한국 MS에서 SharePoint를 하나라도 더 많은 곳에 팔기 위해 많은 시도들을 하고 있다. 그래서 이 SharePoint를 많은 업체들에게 소개하고 영업을 하고 있다. 그 소개와 영업하기 위해 이 SharePoint의 많은 특/장점을 제시하는데,그 중 하나가 다국어 지원이다.

우리나라의 대부분 업체들이 말하고 있는 다국어 사이트라는 개념과 SharePoint와 외국인의 입장에서 보는 다국어 사이트라는 개념에는 상당한 차이가 있다.
특히 인트라넷 시스템을 기준으로 볼 때, 확연하게 틀리다.

우리나라의 대부분의 업체들이 말하는 다국어 시스템이라는 것은, 사이트내에 담긴 내용과는 별개로 각종 메뉴나 외부 틀에 보이는 모든 형태가 언어별로 다르게 표시되는 시스템을 원한다. 즉 게시판을 예를 들면 게시판의 내용은 한국어가 되었던 영어가 되었던, 러시아어가 되었던 외부의 틀만은 언어 중립적으로 표시되어야 한다는 것이다. ( 유니코드가 나오기 전에는 어떻게 되었는지 궁금할 따름이다. )

외국 입장(SharePoint와 외국인들)에서는 사이트의 내용에 따라 틀도 달라진다는 의미로 해석하면 된다. 만일 영어 사이트라면 틀도, 내용도 영어로만 적혀 있어야 한다. 한국어 사이트면 틀도, 내용도 모두 한국어로 나와야 된다는 의미이다. 즉 언어별로 별개의 사이트로 구성되서 진행되는 것이다.

다국어에 대한  이 차이점은 고객과 SharePoint를 적용하는데 있어 큰 걸림돌이 되고도 남는 부분이 된다. 그냥 다국어라고 MS에서는 이야기 하기 때문에, 고객입장에서는 당연히 언어 설정을 하면 그에 맞게 모든 사이트의 형태가 휘리릭 바뀌기리라 생각하고, SharePoint에서는 다른 언어인 경우 별도 사이트를 구축하여 제공하는 것이다.

어느 쪽 생각이 옳은지는 전혀 모르겠지만, 최소한 국내 IT 업계에서 일하는 만큼 전자를 따르는 것이 옳을지 모르겠다.
하지만, 이런 국내 고객들의 입맛에 맞게 SharePoint로 다국어 지원 사이트를 만든다는건, SharePoint의 기본 기능은 안 쓰고 대거 손을 대버리겠다는 의미와 동일하다.( 결국, 개발자만 죽어나거나, 안하니만 못한 시스템이 구축된다. )

과연 이 사실을 몇몇이나 알지 모르겠다.

여기서는  실제적인 Callback 구현에 필요한 각 부품들에 대한 소개와 그 조립 방법들을 전달한다.

일단 Callback을 수행하기 위한 Javascript를 구성하도록 한다.
Callback을 구현할 때 서버 내에서 동작하는 코드와 클라이언트 내에서 동작하는 코드로 나누어 구성한다. 물론 실제 구현 할 때는 대부분 서버 내에서 추가할 수 있지만, 실제 동작은 각기 나뉘어 동작하게 된다.
Callback의 시작과 종료 모두 Javascript를 이용하게 되기 때문에, 어느정도 Javascript에 대한 이해가 필요하다. (물론 고 난이도까지는 아니지만...)
자세한 내용은 아래의 more..를 클릭한다.

more..

일단 Callback에서 가장 제일 중요하다고 생각되는 부분만을 정리해서 담아 보았다. 다음 3편에서는 실전에서 어떻게 쓰이는지 어떻게 활용할 수 있는지를 다시 둘러보는 시간을 갖도록 한다.

어느새 3월 지나 4월.
집 근처의 여러 그루의 벚나무에서는 어느새 한아름 가득 벚꽃을 만발하고 있다.
차가웠던 바람은 시원해지고, 눈만 부시던 햇살은 벌써 따스하게 내린다.
작게 만들어진 그늘 밑에서 한숨을 자면 인생 낙원의 기분을 절로 느낄 수 있을것 같다.
만물 소생 따위야 그다지 관심 없으니 관계는 없다만, 이런 동적인 기분을 제공하는 날씨는 좋은것 같다.

하지만, 정신적인 피폐는 계속 되고 육체적인 피로감이 쉽게 안풀리기에
생각보다는 그리 즐겁지도 않고, 무언가를 이루고 싶은 의욕도 그다지 안든다.
사실 어지간한 선거들은 안빠지고 늘 했던거 같은데, 이번 만은 그런 생각조차 들지 않았다.
될대로 되라는 식의 생각과 귀찮다는 느낌이 강하게 들었다.

이 미묘하게 모순되는 환경과 나의 차이로 인해 점점 지치기만 한다.
기분 전환이 필요한 걸까...

ASP.NET에서 사용되는 각종 서버 기반의 Control ( Button, TextBox 등등 )이 동작하는 방법을 가만히 살펴보면, 일부 컨트롤에서는 화면 리프레쉬 없이 동작하곤 한다. 또, AJAX 기분을 내기 위해 특정 영역 부분의 데이터만 업데이트 할 때가 있다. 보통 이런 경우 ASP.NET에서 제공하는 Postback이라는 기능을 알게 모르게 사용하게 된다.

왜 이런 기묘한 구성요소를 만들었을까?
일단 왜 이런 것이 필요한지에 대해 살펴보면서 진행하도록 한다. 과거 ASP나 PHP로 웹 응용 프로그램을 짜게 되면, 이른바 Ghost 페이지라는 것을 만들어 사용한다. 화면에 사용자의 입력을 받는 Form을 만들고, 그 Form의 Action 부분에 Ghost 페이지의 URL을 적어 동작하게 한다. 그래서 사용자가 입력 후 Submit 이라는 Form 동작을 하면 자동으로  이 Ghost 페이지를 호출하게 한다.
호출 되는 이 Ghost 페이지는 앞서 있던 Form에 있는 사용자 입력 값들을 GET이든 POST으로든 값을 받아, 이 값을 이용하여 서버에서 처리해야 되는 작업( 데이터베이스 입/출력 또는 비지니스 로직 등등)을 수행하게 된다.
이에 반해 ASP.NET에서는 Ghost 페이지 역할을 없애고 대신 이 Postback이라는 기능으로 대처하게 되었다. 즉 Form에서 Submit을 할 때, 예전 처럼 Ghost 페이지를 부르는 것이 아닌 자기 자신의 페이지를 부르는 것이다. 만일 default.aspx 페이지에 사용자 입력용 Form이 있다면, 그 Form에서 Submit을 하면 default.aspx를 다시 부른다는 것이다. 그래서 사용자의 입력값들을 모두 default.aspx 페이지 내에서 처리해 줄 수 있게 되는 것이다. 한개의 페이지 내에서 다양한 사용자의 액션도 처리할 수 있고, 보다 서버와 유기적으로 동작할 수 있다는 것이다. 페이지 리다이렉트 로 인해 발생되는 보안적인 오류( 이 Ghost 페이지에 별도 추가 설정을 하지 않는 경우 몰래 이 Ghost 페이지만 접속하여 해킹을 할 수 있다. )도 해결할 수 있고, 구현 작업을 위한 각종 소스가 별도 페이지로 쪼개지지 않아 유지보수에도 우수하다. 그외에도 이런 저런 장점이 있지만, 자세한 내용은 ASP.NET 관련 책자나, 사이트를 참조하도록 한다.

이제 이 Postback의 동작 원리를 살펴보도록 하겠다.
이 Postback의 동작을 따라가기 위해서는 먼저 ASP.NET으로 된 Page의 Life cycle 파악이 필요하다. 영어로 Life Cycle이라고 적어 뭔가 고상해 보일지는 모르겠다. 간단히 말해서 서버 상에서 이 ASP.NET 페이지가 언제 메모리에 올라갔다가, 언제 내려가는지를 살펴 보는 것이다.
ASP.NET으로 만든 페이지 자체가 HTML을 의미하는 것이 아니기 때문에, 웹서버에서는 이 ASP.NET 페이지를 메모리에 올려 각종 로직들을 처리하고 그 결과 값에 해당하는 HTML을 생성해서 뿌려주는 것이다. 즉 이런 전체 흐름을 보고 바로 Life Cycle이라 표현 한 것 뿐이다.

즉 Postback이 동작할 때 저 Life Cycle 중 언제 동작하는지를 명확히 알기 위해서는 바로 이 ASP.NET 페이지의 Life Cycle에 대한 이해가 필요하기에 먼저 그 부분을 짚고 넘어가도록 한다.

맨처음 ASPX 페이지를 Web Browser를 이용하여 Load 하게 되면 바로 ASP.NET 페이지의 Life Cycle이 시작된다. 아래의 그림을 보면 Page Load, CreateChildControl, OnPreRender, SaveViewState, Render 이런 순으로 나열 되어 있는데, 이 나열들의 하나하나들은 System.Web.UI.Page 에 만들어져 있는 각각의 메소드들을 의미한다.
보통 ASPX 페이지를 만들게 되면 System.Web.UI.Page를 상속 받아 구성하게 되는데, 상속 받게 되면 그 안의 메소드들이 자동으로 ASPX 페이지에 있는 것 처럼 된다. 물론 자신의 ASPX 페이지 내에 아래와 같은 메소드가 없어도 되는 것 같다고 말씀하시는 분이 계실지 모르겠는데, 만일 ASPX 페이지내에 해당 메소드를 구현 하지 않았다면, System.Web.UI.Page 클래스 자체에 있는 각각의 메소드를 대신 호출 하게 된다. 사실 ASP.NET 페이지를 가지고 여러가지 작업을 하게 되면 보통 아래의 순서들에 제신된 메소드들을 override 해서 대부분 쓰게 된다.

다시 원점으로 돌아와서, ASPX 페이지가 맨처음 불리게 되면 웹서버의 메모리에 올라가게 된다. 그 시점에 실행되는 부분이 바로 Page Load 부분이다. 이 부분은 대개 초기화에 관련된 사항들을 많이 넣게 된다. 그리고 난 뒤 CreateChildControl 이다. 완전 처음 부터 ASP나 PHP 등의 순수 웹 응용프로그램 언어 부터 출발하신 분들 께서는 이 부분이 명확하지 않은들 싶은데, 이 개념은 어떻게 되면 Windows 응용 프로그램 개발 프로세스에서 돌출된 사항으로 생각된다.
즉 ASP.NET에서는 System.Web.UI.Page 라는 큰 틀 안에 Control들을 붙인다는 생각에서 출발한 것이다. 예전에는 사용자 입력하는 값들이나 보여주는 부분을 대부분 HTML 페이지 내에 Form을 만들어 구성했었다. 그렇게 되면 사실 서버와는 완전히 분리되어 Form에서 Submit을 할 때까지는 서버와의 데이터 통신이 불가능하다. 그래서 ASP.NET 에서는 Server Control 이라는 개념을 만들었다. 그래서 그 컨트롤들을 System.Web.UI.Page 내에 붙여서 마치 Window Form 프로그램에서 처럼 넓다란 Form 위에 컨트롤들을 얹어 얹어 만드는 것처럼 구성한 것이다.
보통 해당 객체 내에 있는 Controls 라는 콜랙션 내에 더해주는 것으로 처리하게 된다.
(예 : Button btnOK = new Button; this.Controls.Add(btnOK); )
이런 유형의 소스 구현을 바로 CreateChildControl에서 수행한다.
다음은 OnPreRender. 이를 설명하려면 Render라는 것을 먼저 언급해야 할 것 같다. Render라는 것은 현재 Page 클래스내에 있는 Control들을 모두 합쳐 만든 HTML을 생성해주는 부분이다. 즉 실제 그리기 부분으로 이 부분에 직접 HTML을 뿌려주게 할 수 도 있고, CreateChildControl 에서 Controls.Add(xxxxx)를 통해 조립한 뒤 그 조립한 그대로를 자동으로 HTML화 시켜주기도 한다. 그런데, 이렇게 Render 하기에 앞서, UI에 관련된 일부분의 데이터 조작이나 수정작업을 할 때, 여기서 처리하게 된다. 대개는 PageLoad나 CreateChildControl에서 해주기는 하지만, 가끔Control이 생성되고 Add 되고 난 뒤, 별도 조작을 해야 하는 경우 바로 이 OnPreRender에서 그 뒷처리를 하곤 한다. 그리고 SaveViewState. 페이지가 새로 고침을 하는 경우 보통 HTML로 만든 경우 Input 내에 있는 각종 값들은 날라가게 된다. 그에 반해 ASP.NET을 이용해 만든 TextBox의 경우에는 새로 고침을 해도 값이 안전하게 담겨 있는 경우가 있는데, 그게 바로 이 SaveViewStatus 단계 때, 어떤 값들을 어떤 순서로 저장되는지를 정의하는 부분이다. 사용자가 Button을 누르게 되면 화면이 자동으로 새로 고침하게 되는데, 이 경우 ASP.NET의 Life Cycle이 Redner를 실행한 뒤, 모든 데이터가 사라지게 된다. 즉 C#으로 Behind Code로 클래스를 만들었을 때, 클래스 내의 맴버 변수들의 값들도 모두 사라지게 된다. 이 값들을 임시라도 저장을 할 때 이 부분에 구현하게 된다. 값을 실제 저장하는 방법들은 ASP.NET에 관한 다른 책들이나 자료를 참고하도록 한다. 마지막으로 Render.드디어 각종 처리를 수행한 뒤, 실제 HTML을 찍는 부분이다. 여기서는 HttpTextWriter 라는 개체를 제공하는데, 그 안에 원하는 HTML을 쓰거나, 아니면 base.Render()를 실행해서 해당 Page에 딸린 각종 서버 기반 Control들을 HTML화하여 자동으로 써지게 하는 것이다.

자 위의 Render 까지 하게 되면 실제 웹서버 상에서 해당 페이지 HTML을 클라이언트에게 제공하고, Page 및 그에 딸린 Behind Code들은 메모리 밖으로 퇴출된다. 즉, 모든 데이터들이 사라지게 되는 것이다. ( 물론 SaveVIewState에 저장해 놓을  수 있다. )

위는 ASP.NET 페이지의 Life Cycle이였다면, 과연 이 Postback은 언제 동작하는 것일까?.
일단 위의 모든 Life Cycle이 끝나야 한다. 실제 Postback 처리는 사용자가 실제 수행하는 동작을 대처하기 위한 부분이기 때문에, 무엇보다 선결되야 하는 것인 사용자의 웹브라우저에 HTML로 그림이 확실히 그려져 있어야 한다는 것이다. 그러기에 위의 단계가 완전히 끝나야, 실제적인 Postback이 실행 될 수 있는 조건이 된다.

Postback을 부르기 위해서는 대부분 Javascript를 사용하게 된다. 만일 Button 이라는 서버 기반의 컨트롤이 있다면, C#에서는 Button btnOK = new Button(); btnOK.Text = "OK!"; this.Controls.Add(btnOK);와 같은 단 세줄의 코드로 끝내져도, 실제 HTML로 찍히게 되면, 실제 Javascript를 이용하여 실행될 수 있도록 한다. 즉 ASP.NET의 서버 컨트롤이 진짜 서버에서 실행 동작된다고 보면 안되고, 실제로는 서버 컨트롤의 HTML + Javscript가 바로 그 서버 컨트롤이 된다.
Button .... 이라는 소스는 <input type="button" ..... >이 되고, 저 <input 태그 내에 Javacript로 서버를 다시 부르게 끔 하는 것이다.

아래의 그림을 보면 Callback이라고 적힌 부분이 있는데, Postback으로 이해를 하도록 한다.
자 아래의 Run Callback이라는 부분이 있다. Button에 해당하는 HTML 소스를 끄집어 내 보면 그 안에 click="webform.doPostback(......."  뭐 대충 이런 느낌의 메소드가 들어 있다.
바로 그 부분이 javascript 부분이고, 그 자바 스크립트에서는 각종 필요한 정보를 서버에 보내기 쉽게 구성하는 것이다.

자 이 Postback이 실행되면 어떻게 동작하는 것일까?
아래의 그림을 보시면 대략적인 Postback이 동작하는 그 순서를 볼 수 있을 겁니다.

맨 위의 Run Callback 이라는 부분이 있는데, 그 부분이 바로 Javascript로 된 서버 호출 로직을 담고 있는 부분이다. 이 부분이 기본 ASP.NET 컨트롤이라면 저 Run Callback이 Form의 Submit 으로 동작하는 부분일 것이고, 별도 PostBack 기반의 Callback Interface를 만들어 구성한 경우라면 Javascript로 실행하게 될 것이다. 여기서는 Javascript로 구성한 사용자 정의 Postback을 기준으로 나열할 것이므로 위의 그림이 나오는 것이다.

자 그림을 보면 Postback을 실행하는 경우 LoadViewState를 한뒤 CreateChildControl을 하고 Page를 Load 한다. 그리고 난 뒤 실제 Callback을 실행한다.
아까 맨처음에 떳던 그림과는 순서가 조금 다르지 않은가?

일단 제일 큰 차이점은 바로 Render 부분이 없다는 것이다.
Postback이 발생하였을 때, 실제 페이지에 대한 그림 그리는 부분은 없고, 단지 서버 상에서 ViewState를 복구하고 서버 컨트롤들을 구성한 뒤, Page Load 부분을 수행한다. 그리고 난뒤 Callback에 대한 실제적인 처리를 시작하게 된다. 그림 없이 데이터만 복구 하고 데이터만 돌려주는 구조라는 것이다.

위의 Page LifeCycle을 보면서 Callback에서 처리해야 하는 데이터에 대해 어떻게 보존할 것인지, 그리고 어떻게 처리할 것인지를 판단하면서, 맞추는 것이 관건이다.
초기 ASPX 페이지가 Load되서 Render된 후 Page Unload 되는 순간 모든 데이터는 파괴된다. ( 특히 aspx.cs 파일 내에 정의한 각종 member 변수들 ) 만일 이런 값들을 Callback에서 사용을 한다면 반드시 SaveViewState에서 저장해 놓도록 한다.

그리고 실제 Callback이 처리되어야 하는 로직에서는 RaiseCallbackEvent 에서 처리하도록 한다.

각 상세 코드는 2편에서 계속하도록 한다.