JSON 및 XML 샘플을 포함한 AJAX 서비스
XmlAjaxService 샘플에서는 WCF(Windows Communication Foundation)를 사용하여 JSON(JavaScript Object Notation) 또는 XML 데이터를 반환하는 AJAX(비동기 JavaScript 및 XML) 서비스를 만드는 방법을 보여 줍니다. 웹 브라우저 클라이언트에서 JavaScript 코드를 사용하여 AJAX 서비스에 액세스할 수 있습니다. 이 샘플은 기본 AJAX 서비스 샘플을 토대로 작성되었습니다.
다른 AJAX 샘플과 달리 이 샘플에서는 ASP.NET AJAX 및 ScriptManager 컨트롤을 사용하지 않습니다. 몇 가지 추가 구성이 있으면 HTML 페이지에서 JavaScript를 통해 WCF AJAX 서비스에 액세스할 수 있으며 여기에서는 이 시나리오를 보여 줍니다. ASP.NET AJAX와 함께 WCF를 사용하는 예제를 보려면 AJAX 샘플을 참조하세요.
이 샘플에서는 작업의 응답 형식을 JSON과 XML 간에 전환하는 방법을 보여 줍니다. 이 기능은 서비스가 ASP.NET AJAX에서 액세스하도록 구성되었는지 아니면 HTML/JavaScript 클라이언트 페이지에서 액세스하도록 구성되었는지 여부에 관계없이 사용할 수 있습니다.
참고 항목
이 샘플의 설치 절차 및 빌드 지침은 이 항목의 끝부분에 나와 있습니다.
ASP.NET 이외의 AJAX 클라이언트를 사용할 수 있도록 설정하려면 .svc 파일에서 WebServiceHostFactory가 아닌 WebScriptServiceHostFactory를 사용합니다. WebServiceHostFactory는 WebHttpEndpoint 표준 엔드포인트를 서비스에 추가합니다. 엔드포인트는 .svc 파일을 기준으로 하는 빈 주소에 구성됩니다. 이는 작업 이름이 아닌 추가 접미사를 포함하지 않는 http://localhost/ServiceModelSamples/service.svc가 서비스의 주소라는 것을 의미합니다.
<%@ServiceHost language="c#" Debug="true" Service="Microsoft.Samples.XmlAjaxService.CalculatorService" Factory="System.ServiceModel.Activation.WebServiceHostFactory" %>
Web.config의 다음 섹션은 엔드포인트에 대한 추가 구성 변경 작업을 수행하는 데 사용할 수 있으며 추가 변경이 필요하지 않은 경우 제거할 수 있습니다.
<system.serviceModel>
<standardEndpoints>
<webHttpEndpoint>
<!-- Use this element to configure the endpoint -->
<standardEndpoint name="" />
</webHttpEndpoint>
</standardEndpoints>
</system.serviceModel>
WebHttpEndpoint의 기본 데이터 형식은 XML인 반면 WebScriptEndpoint의 기본 데이터 형식은 JSON입니다. 자세한 내용은 ASP.NET을 사용하지 않고 WCF AJAX 서비스 만들기를 참조하세요.
다음 샘플의 서비스는 두 개의 작업을 포함하는 표준 WCF 서비스입니다. 두 작업 모두 Wrapped 또는 WebGetAttribute 특성에서 WebInvokeAttribute 본문 스타일을 필요로 합니다. 이는 webHttp 동작과 관련이 있으며 JSON/XML 데이터 형식 전환과는 관계가 없습니다.
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Xml, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathXml(double n1, double n2);
작업의 응답 형식은 <webHttp> 동작에 대한 기본 설정인 XML로 지정됩니다. 그러나 응답 형식을 명시적으로 지정하는 것이 좋습니다.
다른 작업에서는 WebInvokeAttribute 특성을 사용하고 응답에 대해 XML 대신 명시적으로 JSON을 지정합니다.
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathJson(double n1, double n2);
두 경우 모두 작업은 표준 WCF 데이터 계약 형식인 복합 형식 MathResult를 반환합니다.
클라이언트 웹 페이지 XmlAjaxClientPage.htm에는 사용자가 페이지에서 계산 수행(JSON 반환) 또는 계산 수행(XML 반환) 단추를 클릭할 때 위의 두 작업 중 하나를 호출하는 JavaScript 코드가 포함되어 있습니다. 서비스를 호출하는 코드는 JSON 본문을 만든 다음 HTTP POST를 사용하여 전송합니다. 기본 AJAX 서비스 샘플 및 ASP.NET AJAX를 사용하는 다른 샘플과 달리 이 요청은 JavaScript에서 직접 만듭니다.
// Create HTTP request
var xmlHttp;
// Request instantiation code omitted…
// Result handler code omitted…
// Build the operation URL
var url = "service.svc/ajaxEndpoint/";
url = url + operation;
// Build the body of the JSON message
var body = '{"n1":';
body = body + document.getElementById("num1").value + ',"n2":';
body = body + document.getElementById("num2").value + '}';
// Send the HTTP request
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-type", "application/json");
xmlHttp.send(body);
서비스가 응답하면 페이지의 텍스트 상자에서 더 이상의 처리 작업 없이 응답이 표시됩니다. 이는 사용된 XML 및 JSON 데이터 형식을 직접 확인할 수 있도록 데모용으로 구현됩니다.
// Create result handler
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState == 4){
document.getElementById("result").value = xmlHttp.responseText;
}
}
샘플을 설치, 빌드 및 실행하려면
Windows Communication Foundation 샘플의 일회 설치 절차를 수행했는지 확인합니다.
Windows Communication Foundation 샘플 빌드에 설명된 대로 XmlAjaxService.sln 솔루션을 빌드합니다.
http://localhost/ServiceModelSamples/XmlAjaxClientPage.htm으로 이동합니다. 브라우저의 프로젝트 디렉터리에서 XmlAjaxClientPage.htm을 열지 마세요.