基本 AJAX 服务

2025-06-19

SimpleAjaxService 示例演示如何使用 Windows Communication Foundation （WCF）创建基本 ASP.NET 异步 JavaScript 和 XML （AJAX）服务（可从 Web 浏览器客户端使用 JavaScript 代码访问的服务）。该服务使用 WebGetAttribute 特性来确保服务响应 HTTP GET 请求，并配置为使用 JavaScript 对象表示法（JSON）数据格式进行响应。

WCF 中的 AJAX 支持经过优化，通过 ScriptManager 控件与 ASP.NET AJAX 一起使用。有关将 WCF 与 ASP.NET AJAX 配合使用的示例，请参阅 AJAX 示例。

注释

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

在以下代码中，该 WebGetAttribute 属性应用于 Add 作，以确保服务响应 HTTP GET 请求。代码使用 GET 来简单起见（可以从任何 Web 浏览器构造 HTTP GET 请求）。还可以使用 GET 启用缓存。在没有 WebGetAttribute 属性时，默认使用 HTTP POST。

[ServiceContract(Namespace = "SimpleAjaxService")]
public interface ICalculator
{
    [WebGet]
    double Add(double n1, double n2);
    //Other operations omitted…
}

示例 .svc 文件使用 WebScriptServiceHostFactory，这会向服务添加一个标准终结点 WebScriptEndpoint。可在相对于 .svc 文件的空地址处配置该终结点。这意味着服务的地址是http://localhost/ServiceModelSamples/service.svc，仅包含操作名称，没有其他后缀。

<%@ServiceHost language="C#" Debug="true" Service="Microsoft.Samples.SimpleAjaxService.CalculatorService" Factory="System.ServiceModel.Activation.WebScriptServiceHostFactory" %>

已预先配置 WebScriptEndpoint，以便从 ASP.NET AJAX 客户端页面访问服务。 Web.config 中的以下部分可用于对终结点进行其他配置更改。如果没有额外的更改，则可以将其删除。

<system.serviceModel>
  <standardEndpoints>
    <webScriptEndpoint>
      <!-- Use this element to configure the endpoint -->
      <standardEndpoint name=""  />
    </webScriptEndpoint>
  </standardEndpoints>
</system.serviceModel>

将 WebScriptEndpoint 服务的默认数据格式设置为 JSON 而不是 XML。要调用该服务，请在完成本主题中稍后展示的设置和构建步骤后导航到 http://localhost/ServiceModelSamples/service.svc/Add?n1=100&n2=200。此测试功能是通过使用 HTTP GET 请求启用的。

客户端网页SimpleAjaxClientPage.aspx包含 ASP.NET 代码，每当用户单击页面上的作按钮之一时，调用服务。该 ScriptManager 控件用于使服务的代理可通过 JavaScript 访问。

<asp:ScriptManager ID="ScriptManager" runat="server">
    <Services>
        <asp:ServiceReference Path="service.svc" />
    </Services>
</asp:ScriptManager>

本地代理被实例化，并使用以下 JavaScript 代码调用操作。

// Code for extracting arguments n1 and n2 omitted…
// Instantiate a service proxy
var proxy = new SimpleAjaxService.ICalculator();
// Code for selecting operation omitted…
proxy.Add(parseFloat(n1), parseFloat(n2), onSuccess, onFail, null);

如果服务调用成功，代码将 onSuccess 调用处理程序，作结果将显示在文本框中。

function onSuccess(mathResult){
     document.getElementById("result").value = mathResult;
}

通过

基本 AJAX 服务

其他资源