Поделиться через

Сервис AJAX с образцом JSON и XML

В примере XmlAjaxService показано, как использовать Windows Communication Foundation (WCF) для создания асинхронной службы JavaScript и XML (AJAX), которая возвращает нотацию объектов JavaScript (JSON) или XML-данные. Доступ к службе AJAX можно получить с помощью кода JavaScript из клиента веб-браузера. Этот пример основан на примере базовой службы AJAX .

В отличие от других примеров AJAX, этот пример не использует ASP.NET AJAX и ScriptManager элемент управления. При дополнительной настройке службы WCF AJAX можно использовать с любой HTML-страницы с помощью JavaScript, и этот сценарий демонстрируется здесь. Пример использования WCF с ASP.NET AJAX см. в примерах AJAX.

В этом примере показано, как переключить тип отклика между JSON и XML. Эта функция доступна независимо от того, настроена ли служба для доступа с помощью ASP.NET AJAX или клиентской страницы HTML/JavaScript.

Замечание

Процедура установки и инструкции по сборке для этого примера находятся в конце этого раздела.

Чтобы включить использование клиентов AJAX non-ASP.NET, используйте WebServiceHostFactory (не WebScriptServiceHostFactory) в SVC-файле. 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. Дополнительные сведения см. в разделе "Создание служб WCF AJAX без ASP.NET".

Служба в следующем примере — это стандартная служба WCF с двумя операциями. Для обеих операций требуется стиль кузова Wrapped на атрибутах WebGetAttribute или WebInvokeAttribute, что характерно для поведения webHttp и не влияет на переключение формата данных JSON/XML.

[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Xml, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathXml(double n1, double n2);

Формат отклика для операции указывается как XML, который является параметром по умолчанию для <поведения webHttp> . Однако рекомендуется явно указать формат ответа.

Другая операция использует WebInvokeAttribute атрибут и явно указывает JSON вместо XML для ответа.

[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathJson(double n1, double n2);

Обратите внимание, что в обоих случаях операции возвращают сложный тип, MathResultкоторый является стандартным типом контракта данных WCF.

Веб-страница клиента XmlAjaxClientPage.htm содержит код JavaScript, который вызывает один из предыдущих двух операций, когда пользователь щелкает кнопки "Выполнить вычисление " (возвращать JSON) или "Выполнить вычисление" (возвращаемый XML) на странице. Код для вызова службы создает текст JSON и отправляет его с помощью HTTP POST. Запрос создается вручную в JavaScript, в отличие от примера службы Basic AJAX и других примеров с помощью ASP.NET AJAX.

// 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;
     }
}

Настройка, сборка и запуск примера

  1. Убедитесь, что вы выполнили процедуру настройки One-Time для образцов Windows Communication Foundation.

  2. Создайте решение XmlAjaxService.sln, как описано в разделе "Создание примеров Windows Communication Foundation".

  3. Перейдите к http://localhost/ServiceModelSamples/XmlAjaxClientPage.htm (не открывайте XmlAjaxClientPage.htm в браузере из каталога проекта).

См. также