Wednesday, May 20, 2009

Consuming WCF Services in Silverlight 2.0.

 
In this lab, we will try to Consume WCF Service in Silverlight application. In this Lab we will try to see different topics like-

1) WCF (Windows Communication Foundation).

2) LINQ (Language Integrated Query).

3) ADO.NET Entity Framework.

Note-: I am planning to do lab manuals for above specified topics also in future.

Well, all above topics are out of scope from our Silverlight 2.0 lab manuals. But if necessary I will give an introduction for each one.

So, let’s start first of all writing WCF Service-

Before that let’s have a introduction about WCF. I will try to explain only one question Why WCF?

To explain Why WCF? let’s take a closer look at a table given bellow-

I found this in one of the article written by -

1) Create a WCF Application by the name “SLWCFService” as shown bellow-

WCFCreateService

2) Once you are ready with the service, delete the bellow files which are already exists under WCF Project-

i) IService.cs.

ii) Service.svc.

3) Right click to WCF project and add new item “WCF Service” with the name “WCFCustomerService.svc” as shown bellow-

AddWCFService

4) Now as we are finished adding WCF Service, let’s Add “ADO.NET Entity Data Model” by the name “CustomerORM.edmx” as shown bellow-

Note-: You must have .NET framework 3.5 SP1 installed before adding this new item.

AddEntityFrame

5) You will see a wizard. Complete the steps as bellow-

i) Generate from Database.

ii) Choose the Connection String and save it in Web.config file.

iii) Make a choice of table in which you are interested. I am making a choice of the same table from Customers Database “CustomerInformation”.

6) So, What is Entity Data Model?

It is nothing but Entity Relationship Model Model used to define Types or structures and map the relationship between them.

7) Now, Let’s start writing WCF Service. Open IWCFCustomerService.cs file which is WCF Contract and write following [OperationContact].

[OperationContract]
string InsertCustomer(string CustomerID, string CustomerName,
string Address, int ContactNo, string City);






8) Next step is, open WCFCustomerService.svc.cs file. Remove the existing code from the class and implement the Interface within the class as bellow-



public class WCFCustomerService : 
IWCFCustomerService
{
#region IWCFCustomerService Members
public string
InsertCustomer(string CustomerID, string CustomerName,
string Address, int ContactNo, string City)
{
throw new
NotImplementedException();
}
#endregion
}


9) So Let’s write a code to add the customer record in our CustomerInformation table using WCF Service-




public string InsertCustomer(string CustomerID, string CustomerName,
string Address, int ContactNo, string City)
{
CustomersEntities edmContext = new CustomersEntities();
edmContext.AddToCustomerInformation(new CustomerInformation()
{
CustomerID = CustomerID,
CustomerName = CustomerName,
Address = Address,
ContactNo = ContactNo,
City = City
});
int i = edmContext.SaveChanges();
if (i > 0)
return "Customer Information stored successfully !!";
else
return "Not Successful ???";
}



10) Now the Most Important. You need to make a small change with Binding in Web.Config file. Because Silverlight 2.0 does not support wsHttpBinding, you will have to change it to basicHttpBinding.


First in Web.Config file find <system.serviceModel> section. Then find the Endpoint like bellow-




<endpoint address="" binding="wsHttpBinding" 
contract="WCFCustomerService.IWCFCustomerService">





And Change it to bellow-



<endpoint address="" binding="basicHttpBinding" 
contract="WCFCustomerService.IWCFCustomerService">




12) Now as you have made the changes into Web.Config file, Make a copy of clientaccesspolicy.xml Or crossdomain.xml which we had seen in last demo into root folder of WCF Service.



13) Now let’s test it. Right click to “WCFCustomService.svc” and view in browser. You will see browser instance with link to see WSDL.


14) Now Let’s design the screen to enter the Customer Information using Silverlight application like bellow-



<UserControl 
x:Class="CustomerSLApplication.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400"
Height="350">
<Grid x:Name="LayoutRoot"
Background="Black">
<StackPanel
Orientation="Vertical">
<StackPanel
Orientation="Horizontal">
<TextBlock Text="CustomerID" Margin="10"
Foreground="White"/>
<TextBox x:Name="CustID" Margin="38,10,0,10"
Width="200"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<TextBlock Text="Customer Name" Margin="10"
Foreground="White"/>
<TextBox x:Name="CustName" Margin="13,10,0,10"
Width="200"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<TextBlock Text="Address" Margin="10"
Foreground="White"/>
<TextBox x:Name="CustAddress" Margin="57,10,0,10"
Width="200"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<TextBlock Text="Contact No." Margin="10"
Foreground="White"/>
<TextBox x:Name="CustContNo" Margin="35,10,0,10"
Width="200"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<TextBlock Text="City" Margin="10"
Foreground="White"/>
<TextBox x:Name="CustCity" Margin="77,10,0,10"
Width="200"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<Button Content="Clear" Width="100"
x:Name="btnClear" Click="btnClear_Click" Margin="20"
Foreground="Purple"/>
<Button Content="Insert Data" Margin="20"
x:Name="btnInsert" Click="btnInsert_Click" Width="150"
Foreground="Purple"/>
</StackPanel>
<StackPanel
Orientation="Horizontal">
<TextBlock x:Name="Notification" Margin="20"
Foreground="White"
Text="Notification"/>
</StackPanel>
</StackPanel>
</Grid>
</UserControl>



15) Now let’s write the code to access the WCF Service and insert our Customer details into the database.


16) Add WCF service reference to Silverlight project and write a code on Click event of “Insert Data” button as follows-




WCFClientProxy.Service1Client proxy = new 
CustomerSLApplication.WCFClientProxy.Service1Client();
private void btnInsert_Click(object sender,
RoutedEventArgs e)
{
proxy.InsertCustomerCompleted +=
new EventHandler<CustomerSLApplication.WCFClientProxy.
InsertCustomerCompletedEventArgs>
(proxy_InsertCustomerCompleted);
proxy.InsertCustomerAsync(CustID.Text, CustName.Text,
CustAddress.Text, int.Parse(CustContNo.Text), CustCity.Text);
}
void proxy_InsertCustomerCompleted(object sender,
CustomerSLApplication.WCFClientProxy.InsertCustomerCompletedEventArgs e)
{
Notification.Text = e.Result;
}




17) Now hit F5 !! Test your application, and see the notification as bellow-



OutputofWS



18) For “Clear” button click event write following code-






private void btnClear_Click(object sender, RoutedEventArgs e)
{
CustID.Text = "";
CustName.Text = "";
CustAddress.Text = "";
CustContNo.Text = "";
CustCity.Text = "";
CustID.Focus();
}






19) That’s all !! you are done with the assignment !!



Now as you have completed writing the tenth Silverlight Lab, let’s have a closer look on eleventh lab “Querying data from Collection using LINQ and Silverlight 2.0.

No comments:

Post a Comment