包含 JSON 和 XML 示例的 AJAX 服务

XmlAjaxService 示例演示如何使用 Windows Communication Foundation (WCF) 创建异步 JavaScript 和 XML (AJAX) 服务,该服务返回 JavaScript 对象表示法(JSON)或 XML 数据。 可以从 Web 浏览器客户端使用 JavaScript 代码访问 AJAX 服务。 此示例基于 基本 AJAX 服务 示例生成。

与其他 AJAX 示例不同,此示例不使用 ASP.NET AJAX 和 ScriptManager 控件。 通过一些其他配置,可以通过 JavaScript 从任何 HTML 页面访问 WCF AJAX 服务,此方案如下所示。 有关将 WCF 与 ASP.NET AJAX 配合使用的示例,请参阅 AJAX 示例

此示例演示如何在 JSON 和 XML 之间切换作的响应类型。 无论服务是通过 ASP.NET AJAX 还是 HTML/JavaScript 客户端页进行访问,都可以使用此功能。

注释

本示例的设置过程和生成说明位于本主题末尾。

若要启用 non-ASP.NET AJAX 客户端,请在 .svc 文件中使用 WebServiceHostFactory(而不是 WebScriptServiceHostFactory)。 WebServiceHostFactoryWebHttpEndpoint 标准终结点添加到服务。 终结点在相对于 .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 行为,且 WebInvokeAttributewebHttp 属性不会影响 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 中手动创建的,与 基本 AJAX 服务 示例和使用 AJAX ASP.NET 的其他示例不同。

// 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. 确保已为 Windows Communication Foundation 示例 执行One-Time 安装过程。

  2. 生成解决方案XmlAjaxService.sln,如 生成 Windows Communication Foundation 示例中所述。

  3. 导航到 http://localhost/ServiceModelSamples/XmlAjaxClientPage.htm (不要从项目目录在浏览器中打开 XmlAjaxClientPage.htm)。

另请参阅