Calling your WCF web service from an ASP.NET AJAX page
The 3.5 beta version of the .NET platform lets us use JSON as the serialization format used by a web service call. The best of all is that this means that we can now call a web service from an ASP.NET AJAX page.
To do this, you need to add some entries to your configuration file (on the server side). Getting a proxy on the client side is a simple as adding a service reference through the ScriptManager control. Lets start by seeing the service code (which was generated by adding a new WCF service to an AJAX futures enabled web site):
[ServiceContract()]
public interface ITest
{
[OperationContract]
string MyOperation1(string myValue);
}
public class Test : ITest
{
public string MyOperation1(string myValue)
{
return "Hello: " + myValue;
}
}
The svc file looks like this:
<%@ ServiceHost Language="C#" Debug="true" Service="Test"
CodeBehind="~/App_Code/Test.cs" %>
Now you need to add an endpoint that is able to understand JSON. In my case, I wanted to expose a mex endpoint too, so I ended up with the following definitions for my web service:
<services>
<service name="Test" behaviorConfiguration="metadataSupport">
<endpoint binding="webHttpBinding"
behaviorConfiguration="jsonBehavior"
contract="ITest"
bindingConfiguration="jsonBinding"/>
<endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange"/>
</service>
</services>
As you can see, i'm using a WebHttpBinding and I'm saying that there's a new jsonBinding element which configures the traditional webHttpBinding that is introduced by default by the WCF framework. In this case, we're just setting the message encoding to JSON:
<bindings>
<webHttpBinding>
<binding name="jsonBinding" messageEncoding="Json"/>
</webHttpBinding>
</bindings>
We also need to add a new behavior that looks like this:
<behaviors>
<serviceBehaviors>
<behavior name="metadataSupport">
<serviceMetadata httpGetEnabled="true" httpGetUrl=""/>
</behavior>
</serviceBehaviors>
<endpointBehaviors>
<behavior name="jsonBehavior">
<enableWebScript />
</behavior>
</endpointBehaviors>
</behaviors>
And that's it! the only thing you need to do to call this WCF service from your AJAX ASP.NET page is add a reference to the web service:
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="Test.svc" />
</Services>
</asp:ScriptManager>
Doing this ends up inserting the following js code in your page:
Type.registerNamespace('tempuri.org');
ITest=function() {
ITest.initializeBase(this);
this._timeout = 0;
this._userContext = null;
this._succeeded = null;
this._failed = null;
}
ITest.prototype={
MyOperation1:function(myValue,succeededCallback, failedCallback, userContext) {
return this._invoke(ITest.get_path(), 'MyOperation1',false,{myValue:myValue},succeededCallback,failedCallback,userContext); }}
ITest.registerClass('ITest',Sys.Net.WebServiceProxy);
ITest._staticInstance = new ITest();
ITest.set_path = function(value) { ITest._staticInstance._path = value; }
ITest.get_path = function() { return ITest._staticInstance._path; }
ITest.set_timeout = function(value) { ITest._staticInstance._timeout = value; }
ITest.get_timeout = function() { return ITest._staticInstance._timeout; }
ITest.set_defaultUserContext = function(value) { ITest._staticInstance._userContext = value; }
ITest.get_defaultUserContext = function() { return ITest._staticInstance._userContext; }
ITest.set_defaultSucceededCallback = function(value) { ITest._staticInstance._succeeded = value; }
ITest.get_defaultSucceededCallback = function() { return ITest._staticInstance._succeeded; }
ITest.set_defaultFailedCallback = function(value) { ITest._staticInstance._failed = value; }
ITest.get_defaultFailedCallback = function() { return ITest._staticInstance._failed; }
ITest.set_path("/AJAXFuturesEnabledWebSite2/Test.svc");
ITest.MyOperation1= function(myValue,onSuccess,onFailed,userContext) {ITest._staticInstance.MyOperation1(myValue,onSuccess,onFailed,userContext); }
which really looks similar to waht you get when you add JSON support to an ASMX web service.