Introduction
In this article we are going to see the end to end integration of Azure AppFabric Service bus and Silverlight. First we are going to create a very basic “Hello World” Silverlight application that interacts with a WCF operation called “GetWelcomeText” and displays the text returned in the UI. In order to explain the core concepts clearly, we are going to keep the sample as simple as possible. The initial solution is going to look as shown below. The SL application hosted on a local IIS/AppFabric(server) web server and accessed via a browser as shown below.
Next, we are going to extend the same sample “Hello World” example to introduce Azure AppFabric service bus as shown in the below picture and show the power of AppFabric Service bus platform, which enables us to use the remote WCF services hosted geographically somewhere in the wild.
Original Source: http://biztalk360.com/author/saravanakumar
The first part of the article doesn’t going to touch anything on Azure AppFabric service bus, it’s all about creating a simple SL/WCF application.
Create a Hello World Silverlight Application
Open Visual Studio (use Run as Administrator), and Click New Project from the Start page, which will bring the “New Project” window as shown below
Select Silverlight from Installed Templates, and choose “Silverlight Application” from the list. Provide “AppFabricSBandSLIntegration” as the name and click OK. In the next screen (“New Silverlight Application”), just leave the default values and click OK. The solution structure will look as shown below.
Add a simple WCF service:
Right click on
AppFabricSBandSLIntegration.Web ASP.NET application and select “Add New Item”, which brings the “Add New Item” window as shown below.
Select “Web” from Installed templates and “WCF Service” from the list provide “AdminService.svc” as the name and click “Add”.
Next, rename the default method name “DoWork” to “GetWelcomeText” and changed the return type from “void” to “string” both in IAdminService.cs and AdminService.cs files. The implementation now looks as shown below.
Rebuild the solution by pressing
Ctrl+Shift+B.
Convert the web application to use IIS:
By default the ASP.NET web application will be configured to run on a local server (cassini), for our demo we are going to configure it to run under IIS/AppFabric(server). Right click on the
AppFabricSBandSLIntegration.Web project, select “Properties”. In the properties windows select “Web” from LHS and select the option “Use Local IIS Web Server”. Click on “Create Virtual Directory” button to create the virtual directory and click OK on the popup window (you must have opened Visual Studio by Run as Administrator; else this step will give error.)
Build the solution by pressing Ctrl+Shift+B, and navigate to
http://localhost/AppFabricSBandSLIntegration.Web/AdminService.svc and make sure no errors encountered.
Configure web.config file with appropriate WCF settings
For this step we are going to use the WCF service configuration tool SvcConfigEditor.exe. Open a Visual Studio command prompt and type SvcConfigEditor.exe. Once the application is opened, click File/Open and navigate to web.config file found under
AppFabricSBandSLIntegration.Web folder.
Click on “Create a New Service” link and click the browse button. Navigate to
AppFabricSBandSLIntegration.Web/bin/ AppFabricSBandSLIntegration.Web.dll and select
AppFabricSBandSLIntegration.Web.AdminService once selected the screen should look as shown below
Click on the “Next” button in the wizard and make sure the contract is selected as shown below.
Click “Next”, On “What communication mode is your service using?” option select “HTTP”
Click “Next”, On “What method of interoperability do you want to use?” option select “Basic web service interoperability”
Click “Next”, On “What’s your address of your end point”, clear http:// and click “Yes” on the warning.
On the final summary screen, click “Finish”. Your
web.config file will now look as shown below.
Rebuild the solution by pressing Ctrl+Shift+B. Right click on
AdminService.svc file and select “
View in Browser“. Make sure it displays as shown below without any errors.
Now we have completed all the required stuff on the WCF services side, let’s move on to the client side Silverlight application.
Prepare the Silverlight application to communicate with the WCF Service.
Add Service Reference:
The very first step is to create the service reference to our AdminService.svc WCF service. Right click on the
AppFabricSBandSLIntegration Silverlight project and select “Add Service Reference”, which will bring the window as shown below.
Paste the url of our AdminService.svc file and click “Go”. Once the service is resolved, provide “AdvancedServiceReference” as the namespace and click “OK”.
The above step should automatically add ServiceReference.ClientConfig file to the AppFabricSBandSLIntegration Silverlight project as shown below.
Open the MainPage.xaml file and add a TextBlock as shown in the below snippet.
Open the MainPage.Xaml.cs file and add the following lines of code. Basically we are instantiating the proxy client, hooking up the “Completed” event and call the asyn method GetWelcomeTextAsync. Once we receive the response from WCF service, SL runtime will automatically execute the code present in the event handler. We are simply displaying the “Hello World from WCF Service” text returned from WCF service in the text block we created in the previous step.
At this stage everything is completed and pressing the “F5” button should execute the ASP.NET/Silverlight application and display the following result
In
part 2 of the article, we’ll see how we can introduce Azure AppFabric Service bus in the middle between the Silverlight client and the WCF service. You may be wondering, why I have used the SvcConfigEditor.exe to configure the WCF service rather just simply asking the user to paste 4 lines of configuration Xml. The main reason for using the tool is, when we modify the configuration for Azure AppFabric Service Bus, it makes it easy to understand all the available configuration options.
Next, we are going to extend the same sample “Hello World” example to introduce Azure AppFabric service bus as shown in the below picture and show the power of AppFabric Service bus platform, which enables us to use the remote WCF services hosted geographically somewhere in the wild.
Original Source: http://biztalk360.com/author/saravanakumar
The first part of the article doesn’t going to touch anything on Azure AppFabric service bus, it’s all about creating a simple SL/WCF application.
Create a Hello World Silverlight Application
Open Visual Studio (use Run as Administrator), and Click New Project from the Start page, which will bring the “New Project” window as shown below
Select Silverlight from Installed Templates, and choose “Silverlight Application” from the list. Provide “AppFabricSBandSLIntegration” as the name and click OK. In the next screen (“New Silverlight Application”), just leave the default values and click OK. The solution structure will look as shown below.
Add a simple WCF service:
Right click on AppFabricSBandSLIntegration.Web ASP.NET application and select “Add New Item”, which brings the “Add New Item” window as shown below.
Select “Web” from Installed templates and “WCF Service” from the list provide “AdminService.svc” as the name and click “Add”.
Next, rename the default method name “DoWork” to “GetWelcomeText” and changed the return type from “void” to “string” both in IAdminService.cs and AdminService.cs files. The implementation now looks as shown below.
Rebuild the solution by pressing Ctrl+Shift+B.
Convert the web application to use IIS:
By default the ASP.NET web application will be configured to run on a local server (cassini), for our demo we are going to configure it to run under IIS/AppFabric(server). Right click on the AppFabricSBandSLIntegration.Web project, select “Properties”. In the properties windows select “Web” from LHS and select the option “Use Local IIS Web Server”. Click on “Create Virtual Directory” button to create the virtual directory and click OK on the popup window (you must have opened Visual Studio by Run as Administrator; else this step will give error.)
Build the solution by pressing Ctrl+Shift+B, and navigate to http://localhost/AppFabricSBandSLIntegration.Web/AdminService.svc and make sure no errors encountered.
Configure web.config file with appropriate WCF settings
For this step we are going to use the WCF service configuration tool SvcConfigEditor.exe. Open a Visual Studio command prompt and type SvcConfigEditor.exe. Once the application is opened, click File/Open and navigate to web.config file found under AppFabricSBandSLIntegration.Web folder.
Click on “Create a New Service” link and click the browse button. Navigate to AppFabricSBandSLIntegration.Web/bin/ AppFabricSBandSLIntegration.Web.dll and select AppFabricSBandSLIntegration.Web.AdminService once selected the screen should look as shown below
Click on the “Next” button in the wizard and make sure the contract is selected as shown below.
Click “Next”, On “What communication mode is your service using?” option select “HTTP”
Click “Next”, On “What method of interoperability do you want to use?” option select “Basic web service interoperability”
Click “Next”, On “What’s your address of your end point”, clear http:// and click “Yes” on the warning.
On the final summary screen, click “Finish”. Your web.config file will now look as shown below.
Rebuild the solution by pressing Ctrl+Shift+B. Right click on AdminService.svc file and select “View in Browser“. Make sure it displays as shown below without any errors.
Now we have completed all the required stuff on the WCF services side, let’s move on to the client side Silverlight application.
Prepare the Silverlight application to communicate with the WCF Service.
Add Service Reference:
The very first step is to create the service reference to our AdminService.svc WCF service. Right click on the AppFabricSBandSLIntegration Silverlight project and select “Add Service Reference”, which will bring the window as shown below.
Paste the url of our AdminService.svc file and click “Go”. Once the service is resolved, provide “AdvancedServiceReference” as the namespace and click “OK”.
The above step should automatically add ServiceReference.ClientConfig file to the AppFabricSBandSLIntegration Silverlight project as shown below.
Open the MainPage.xaml file and add a TextBlock as shown in the below snippet.
Open the MainPage.Xaml.cs file and add the following lines of code. Basically we are instantiating the proxy client, hooking up the “Completed” event and call the asyn method GetWelcomeTextAsync. Once we receive the response from WCF service, SL runtime will automatically execute the code present in the event handler. We are simply displaying the “Hello World from WCF Service” text returned from WCF service in the text block we created in the previous step.
At this stage everything is completed and pressing the “F5” button should execute the ASP.NET/Silverlight application and display the following result
In part 2 of the article, we’ll see how we can introduce Azure AppFabric Service bus in the middle between the Silverlight client and the WCF service. You may be wondering, why I have used the SvcConfigEditor.exe to configure the WCF service rather just simply asking the user to paste 4 lines of configuration Xml. The main reason for using the tool is, when we modify the configuration for Azure AppFabric Service Bus, it makes it easy to understand all the available configuration options.
