ASP.NET - ICallback을 이용한 JSON 기반의 Javascript Serialization

2010. 4. 15. 19:30Programming/ASP.NET


원문 참조 : http://aspalliance.com/1537_ICallback__JSON_Based_JavaScript_Serialization.1



* 4월 19일 추가 내용
프로젝트 기반은 .NET Framework 3.5 프로젝트로 설정하고 진행하셔야 합니다.

그리고 제가 테스트해 본 소스도 첨부합니다.

예제 소스 파일 다운로드 :





아직 테스트 해보지는 않은 코드이지만 흥미로운 내용이네요~

별다른 라이브러리를 사용하지 않고 ICallback을 이용해서 Javascript Serialization을 JSON Object 형식으로 처리할 수 있는 방법이니깐요.

먼저 Page나 Controll 클래스에서 System.Web.UI.ICallbackEventHandler를 Implement 해야한다고 합니다.


아래 RaiseCallbackEvent 메소드가 자바스크립트 함수를 호출하게 되고요.
RaiseCallbackEvent method invoke through JavaScript function

public void RaiseCallbackEvent(string eventArgument)
{
  //to do code here
}



RaiseCallbackEvent가 완료되면 알아서 GetCallbackResult가 호출되도록 하고요.
GetCallbackResult method invokes itself when the processing of RaiseCallbackEvent method is completed.

public string GetCallbackResult() 
{
  return "";
}



이제 Page_Load나 Page_Init 부분에서 사용자 스크립트를 등록합니다. 'CallServer' 형식으로 아래 예제는 등록하고 있네요.

해당 스크립트에선 CallbackEventReference 를 가져가니 서버측을 호출하도록 되어있죠.

이렇게 하면 C/S 간의 상호 호출되는 부분이 완성되는 듯 합니다.

protected void Page_Load(object sender, EventArgs e)
{
ClientScriptManager scriptMgr = Page.ClientScript;
String cbReference = scriptMgr.GetCallbackEventReference(this"arg"
"ReceiveServerData""");
String callbackScript = "function CallServer(arg, context) {" + cbReference + "; }";        
scriptMgr.RegisterClientScriptBlock(this.GetType(),"CallServer", callbackScript, true);
}




이제 사용자 쪽의 스크립트를 등록합니다.

버튼을 클릭하면 CallSrv를 호출하고 CallServer는 서버측 메소드를 호출해 결과값은 ReceiveServerData를 통해 받도록 되어 있죠.

<script language=javascript type=text/javascript>
function ReceiveServerData(arg, context)
{
  alert(arg); //just to show output

function CallSrv()
{
  CallServer('get customer', '');
}
</script>
<input type="button" value="get customer" onclick="CallSrv()" />



이제 서버측에서 customer 형식에 대한 정의가 필요하겠죠. 아래와 같은 JAVA에서 보면 Beans 와 같은 C# 에서의 클래스 하나를 정의합니다.

public class Customer
{
  public string Name;
  public int Age;
}




이제 핵심적으로 RaiseCallbackEvent 를 정의하는데요.
이 부분이 가장 핵심인 것 같네요.

System.Web.Script.Serialization.JavaScriptSerializer
를 사용하고 있고, 이를 통해서 JSON 형식으로 Object를 반환하도록 해줍니다.

C# 에서의 Class Object (Java로 보면 Beans) 형식을 JSON 형식으로 변수로 받으면
Javascript에서도 객체 형식으로 바로 사용할 수 있게 되겟네요

public void RaiseCallbackEvent(string eventArgument)
{
  //populate Customer object to return
  Customer customer = new Customer();
  customer.Name = "Muhammad Adnan";
  customer.Age = 24;
  //javascript serialization of Customer object
  System.Web.Script.Serialization.JavaScriptSerializer jss;
  jss = new System.Web.Script.Serialization.JavaScriptSerializer();
 
  //stringbuilder to contain serialized customer object
  System.Text.StringBuilder sbCustomer = new System.Text.StringBuilder();
  jss.Serialize(customer, sbCustomer);
 
  jsonResult = sbCustomer.ToString();
}
 
public string GetCallbackResult()
{
  return jsonResult;
}




아래 메시지는 샘플로 출력해본 내용입니다.






별 다른 라이브러리를 사용하거나 하지 않고,

페이지의 PostBack이 일어나거나 페이지가 Refresh 되지 않고 데이터 처리하는 내용으로 아주 좋은 활용이 되겠네요 ^ ^