Wahlin on .NET
Consuming Web Services with ASP.NET AJAX
Leverage .NET Web services using the ScriptServiceAttribute through the ScriptManager control.
This week I'll cover how you can use ASP.NET AJAX to consume .NET Web services that have been marked with the ScriptServiceAttribute class. By using Web services, you can significantly minimize request and response message sizes passed between the client and server, and allow the client to process and format the data that's exchanged.
To consume a .NET Web service that has been marked with the ScriptServiceAttribute,
you can leverage the ASP.NET AJAX ScriptManager control. ScriptManager handles
generating JavaScript proxy classes that can be used to call Web services using
the XMLHttpRequest object. The ScriptManager control exposes a services property
that can be used to define the paths to one or more Web services that will be
used by a page.
Web services file paths can be defined within the services property by using
a ServiceReference control as shown in Listing 1.
At run-time, the ScriptManager will embed script tags into the page that reference the target Web services. Here are examples of the script tags generated by the ScriptManager:
<script src="MathService.asmx/js
"type="text/javascript"></script>
<script src="CustomerService.asmx/js"
type="text/javascript"></script>
Notice that each Web service file has /js appended to the end. If you go to
a Web service marked with the ScriptServiceAttribute in the browser and add
/js on the end of it, you can see the JavaScript proxy code that is generated.
When the compilation element's debug attribute is set to a value of true in
web.config, /jsdebug will be appended on the end instead of /js since the application
is in debug mode in that case.
Once the Web service proxy is available, you can write client-side code to
call the service. This is done by referencing the service's namespace, class
and Web method. Listing 2 shows a simple Web service named MathService that's
in a namespace named XmlForAsp.
To call this service using the client-side proxy object, you reference the
XmlForAsp namespace, the MathService class and the Add() method. Parameters
expected by the Add() method are passed along with a callback method that is
called when the Web Service response is received by the client. Listing 3 shows
an example of calling the MathService's Add() method and writing the result
out to the page.
Although the Add() method shown earlier returns a simple Integer type, Web
services that return complex types can also be consumed by ASP.NET AJAX pages.
Listing 4 shows a service that returns a Customer object that exposes several
properties. An example of using a proxy object to call the service and access
the properties exposed by the Customer object is shown in Listing 5. Looking
through the code, you'll see that the properties can be accessed directly by
going through the result object passed to the callback method.
ASP.NET AJAX makes the process of consuming Web services quick and easy. By
using the ScriptManager to generate proxy classes, you can easily add Web service
calls as needed into an application and work with simple or complex types.
About the Author
Dan Wahlin (Microsoft MVP for ASP.NET and XML Web Services) is the founder of The Wahlin Group which specializes in .NET and SharePoint onsite, online and video training and consulting solutions. Dan also founded the XML for ASP.NET Developers Web site, which focuses on using ASP.NET, XML, AJAX, Silverlight and Web Services in Microsoft's .NET platform. He's also on the INETA Speaker's Bureau and speaks at conferences and user groups around the world. Dan has written several books on .NET including "Professional Silverlight 2 for ASP.NET Developers," "Professional ASP.NET 3.5 AJAX, ASP.NET 2.0 MVP Hacks and Tips," and "XML for ASP.NET Developers." Read Dan's blog here.