Blog

Deployment of Applications with Infragistics Reporting in Windows Azure

[Infragistics] Mihail Mateev / Tuesday, December 27, 2011

NetAdvantage Reporting is a tool that allows developers to create modern, innovative, visually appealing reports by providing an easy-to-use design experience in Visual Studio.  It is possible to use almost anywhere Infragistics Reporting: From XAML applications in ASP.Net WEB solutions based on Visual Studio LightSwitch and those distributed in Windows Azure.

This article is about how to use Infragistics Reporting with Windows Azure XAML applications. It is possible to use this product in Windows Azure ASP.Net applications taking the same specifics as in XAML applications with server-side report rendering. More information about how to integrate Infragistics Reporting in WEB applications you could find in here.

Specifics of the Implementation of Infragistics report in Windows Azure application is closely related to the type of the report rendering.

Report Rendering

There are two different approaches to render reports: 

  • Server-Side Rendering (used in Windows Azure). In this case, the Viewer retrieves a report from a Reporting Service (ServerReportService.svc). This schema separates the report’s user interface handled by the Viewer (the client side) from the actual report and rendering engine that run on the server. Server-side rendering requires a running Report Service.
  • Client-Side Rendering(used in Windows Azure) NetAdvantage Reporting supports also client-side rendering in Silverlight, which works without involving the Report Service. This second scenario requires that the data needed for the report is already located in the client (i.e., in XML files, through RIA Services, or any other web service call). With client-side rendering the report is fully rendered by the client without any server participation.

You can use both approaches in applications with Infragistics Reporting, deployed in Windows Azure.

Client-side rendering is implemented without specifics. We will mention a few words about it in this article. More details about him can be found in the blog Implementing Client-Side Rendering for Infragistics Reporting.

Demo Application

Sample application will demonstrate how to integrate Infragistics Reporting in Windows Azure XAML applications in all possible ways.

Before you start

You should have installed the following products

Windows Azure Prerequisites

  • Create a new SQL Azure database

Log in Windows Azure with your account. Select Database to see a list with existing databases.

Add a new database, named Northwind (Web Edition, Maximum size – 1GB).

  • Set firewall rules:

In order to access the new SQL Azure server outside the Windows Azure Platform Management Portal, you must specify one or more firewall rules. The checkbox labeled Allow other Windows Azure services to access this server should be checked if you want to allow other Windows Azure services and applications to access your SQL Azure Server.

To access your database outside Windows Azure you need to create Firewall rules by setting the range such that your IP address is in that range. Than you should be able to connect to SQL Azure Database from your computer using SQL Server Management Studio, SQL Azure Migration Wizard or a custom client. To test the connection select a database from database tab and click on Test connectivity.

 

  • Create a new Windows Azure Storage Account and a Hosted Service

Migrate a sample database – Northwind from Local SQL Server to SQL Azure

It is possible to migrate SQL Server database to SQL Azure using different tools or manually update generated scripts from Microsoft SQL Server Management Studio. SQL Azure doesn’t support all SQL server settings – this is the reason to need specific tools or to update manually generated scripts for export. In this sample is used SQL Azure Migration Wizard v3.8

To be possible to use a migration wizard with the latest SQL Azure, based on SQL Server 2012, you need to upgrade your SQL Server 2008 R2 with a Service Pack1.

Start SQL Migration Wizard and select “Analyze an Migrate” option

Log to the local SQL server.

Select the database Northwind that want to migrate. For “Choose Objects” select “Script all database objects”.

Connect to SQL Azure server

Select the Northwind database.

Follow the migration wizard until migration completed

Windows Azure Project

Add a new Windows Azure Cloud Service project.

Add a Web Role project AzureTest.Web in Solution. Firstly we will use Windows Azure Emulator to test the application.

Client-Side Rendering

In Solution Explorer, right-click on your Silverlight Application project and, from the context menu. Select Add Service Reference.

In the Address field, type the address of service ( http://services.odata.org/Northwind/Northwind.svc) and specify the namespace of service (NorthwindServiceReference).

  • Implement the loading of the data source

Add in the Silverlight application new class, named NorthwindCustomers. Since all HTTP requests in Silverlight need to be performed asynchronously, you will need to provide a way to wait until the asynchronous call returns and be able to render the report with all its contents.

using System;
using System.Collections.Generic;
using System.Data.Services.Client;
using System.Linq;
using System.Threading;
using System.Windows;
using AzureTest.NorthwindServiceReference;
 
namespace AzureTest
{
    public class NorthwindCustomers
    {
        #region Private Members
 
        private readonly ManualResetEvent _monitor = new ManualResetEvent(false);
 
        #region ODataPeople
 
        private DataServiceCollection<Customer> ODataPeople { get; set; }
 
        #endregion //ODataPeople
 
        #endregion //Private Members
 
 
        #region Methods
 
        #region GetCustomers
 
        public IList<Customer> GetCustomers()
        {
            var oEntities = new NorthwindEntities(new Uri(@"http://services.odata.org/Northwind/Northwind.svc"));
            ODataPeople = new DataServiceCollection<Customer>(oEntities);
            ODataPeople.LoadCompleted -= ODataPeople_LoadCompleted;
            ODataPeople.LoadCompleted += ODataPeople_LoadCompleted;
 
            var query = (from t in oEntities.Customers orderby t.Country select t).Take(100);
 
 
            ODataPeople.LoadAsync(query);
 
            _monitor.WaitOne();
 
            return ODataPeople;
        }
 
        #endregion //GetCustomers
 
        #endregion //Methods
 
 
        #region Event Handlers
 
        #region ODataPeople_LoadCompleted
 
        void ODataPeople_LoadCompleted(object sender, LoadCompletedEventArgs e)
        {
 
            if (e.QueryOperationResponse.Error != null)
            {
                MessageBox.Show(e.QueryOperationResponse.Error.ToString());
            }
            else
            {
                if (ODataPeople.Continuation != null)
                {
                    ODataPeople.LoadNextPartialSetAsync();
                }
                else
                {
                    // All data is loaded
                    _monitor.Set();
                }
 
            }
        }
 
        #endregion //ODataPeople_LoadCompleted
 
        #endregion //Event Handlers
    }
}
  • Add a Report to the client application

Add a Report to the Silverlight application. Create an Object Data Source to retrieve data using the NorthwindCustomers class. This will load the type and properties of the objects from the class and make them available in the Report Data Explorer to use them in the report designer.

  • Add a Report Viewer in the Silverlight client

Add a XamReportViewer control in the MainPage.xaml from the Silverlight client application.

Click over the XamReportViewer control in Visual Studio 2010 designer to choose the Client-Side Render using an option “/ReportingDemo;component/ClientReport.igr”.

<ig:XamReportViewer Margin="10" Name="xamReportViewer1">
    <ig:XamReportViewer.RenderSettings>
        <ig:ClientRenderSettings DefinitionUri="/AzureTest;component/ClientReport.igr" />
    </ig:XamReportViewer.RenderSettings>
</ig:XamReportViewer>

 

Run the application. You will see 100% client rendered report.

Server-Side Rendering

Server-side report  rendering is more specific for Windows Azure applications. First you need to change some application settings in Web.config file.

  • SQL Azure Connection String

If you are using a SQL Azure  database as a report data source you should set the connection string  for your database.

   1: <connectionStrings>
   2:     <add name="sqlDataSource2" connectionString="Data Source=tcp:[Server Name].database.windows.net;Initial Catalog=Northwind;Persist Security Info=True;User ID=[User Name]@[Server Name];Password=[User Password]"
   3:         providerName="System.Data.SqlClient" />
   4: </connectionStrings>

 

The Windows Azure fabric runs IIS 7.0 in integrated mode. You should register reporting images handler under the system.webServer tag (by default it is system.web tag).

   1: <system.webServer>
   2:   <handlers>
   3:     <add name="SampleHandler" verb="*"
   4:       path="*.igrimage"
   5:       type="Infragistics.Reports.Server.ImagesHandler, InfragisticsWPF4.Reports.Server.v11.2, Version=11.2.20112.1010, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb"
   6:       resourceType="Unspecified" />
   7:   </handlers>
   8: </system.webServer>

 

When hosting a Windows Communication Foundation (WCF) service under Internet Information Services (IIS) 7.0, you may want to provide multiple base addresses that use the same protocol on the same site. This allows the same service to respond to a number of different URIs. This is useful  for Windows Azure Applications when you want to host a service that listens on http://127.0.0.1:81/ServerReportService.svc (Windows Azure Emulator usage). It is also useful to create a service that has a base address for internal users and a separate base address for external users. For example: http://localhost:8394/ServerReportService.svc (Stand alone WCF service).

To support this, add the attribute multipleSiteBindingsEnabled="true" for serviceHostingEnvironment tag:

<serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />

 

Report Design

Add a new Infragistics Report instance to the WEB project and name it ServerReport . ServerReport will use data from  will use data directly from a database (SQL Azure).  Format the report to display customers.

Add a XamReportViewer control in the Silverlight application. Set RenderSettings property for the report viewer. Use ServerReport .igr as a report and ServerReportService.svc as a WEB service .

<ig:XamReportViewer Margin="10" Name="xamReportViewer1">
    <ig:XamReportViewer.RenderSettings>
        <ig:ServerRenderSettings DefinitionUri="/AzureTest.Web;component/ServerReport.igr" ServiceEndpointUri="http://127.0.0.1:81/ServerReportService.svc" />
    </ig:XamReportViewer.RenderSettings>
</ig:XamReportViewer>

 

Run the application. Congratulations! You have a server-side report rendering in Windows Azure Application.

 

Deployment in Windows Azure

  • Deploying the Web Role


After developing the web role, we have to package it and deploy to the cloud. The entire steps in this are:

  • Create Web Role
  • Create Package
  • Deploy to Cloud

More details about how to deploy a web role in Windows Azure you could find in the article:

Windows Azure: Creating and Deploying Web Role

  • Report Viewer Settings

Change the endpoint address, used in XamReportViewer.ServerRenderSettings to point to deployed in Windows Azure service.

<ig:XamReportViewer Margin="10" Name="xamReportViewer1">
     <ig:XamReportViewer.RenderSettings>
         <ig:ServerRenderSettings DefinitionUri="/AzureTest.Web;component/ServerReport.igr" ServiceEndpointUri="http://[reporting hosted service].cloudapp.net/ServerReportService.svc" />
     </ig:XamReportViewer.RenderSettings>
 </ig:XamReportViewer>

 

Run the application. Enjoy! You have an  application with Infragistics Reporting , deployed in Windows Azure now.

Special thanks to Leonardo Rodriguez and Damian Da Silva from Infragistics Reporting Team in Montevideo, Uruguay for the help they gave me in creating this article.

Source code you could download here.