Integrate reports in your web applications (ASP.NET, PHP, etc.)

August 22, 2011 by Igor Lozhkin
Arnica WebReport was designed for platform and language-neutral integration with virtually any web applications and components. Access to WebReport functionality is implemented via generic web request API (REST API). Reporting engine may be deployed on the same web server as the rest of web application components, or on a separate server - in any case, integration techniques remain the same. This blog article reviews several integration options, which may be used to make WebReport-generated output part of your web application.

Utilization of Arnica WebReport generic web request API allows implementing loosely-coupled integration approach vs. traditional programmatic strongly-coupled integration approach.  The loosely coupled integration does not require presence or up-time of WebReport at web application design time or during compilation process. Developers can concentrate instead on the rest of the logic of their web application without considering report implementation specifics. On the other hand, report designers may abstragate from other web application development aspects and focus only on report functionality. At the end of the process, web application and web report may be tested together to iron-out integration issues.

Coding requirements for implementing generic web requests is out of the scope of this article. I just want to mention that coding for generic web requests is usually fairly straight-forward: read report base URL from configuration file (for example, web.config), update query string parameters (for example, to pass filter values, sort order specifications, etc.), execute web request against web report or redirect to the web report.

Below are the typical options for integrating reports with web applications. 

1. Open report in a new window 

This is probably the easiest option to show a report from within the web application. The application has a link with report URL and link attribute target="_blank", which specifies that a new browser window is opened when a user clicks on the link.



2. HTTP Redirect 

With this option, application page also has a link to open report, this time within the same browser window. Report typically has a link created at design time to navigate either to back to the page from where the report is invoked, or to another web application page within the workflow sequence.  

9-15-2011 12-04-17 AM.png

3. Embedded in the page (using server-to-server web request) 

In this case, application page contains server side code for executing a web request (server-to-server web request) to report engine. This request returns report output HTML content. The server component, which builds the application page, integrates this output with the rest of page content and then sends entire content to user browser. User perception would be that the page generated the report output itself as the report content in this case is well blended with the rest of page content and has consistent visual presentation theme.

9-15-2011 12-30-27 AM.png

4. Embedded in the page (using iframe)

Application page allocates an area within its content for the HTML iframe element.  The iframe element's src attribute has a value pointing to the report URL. When the application page content is rendered by the browser, the browser makes a request to the report engine using speciifed URL and displayes the returned report content within allocated area on the page.  This design option is used to maintain interactive features of the report while staying on the same web application page. 


5. Embedded in the page (using AJAX)

With this integration option, the server-side component which builds page presentation, adds to the output a special javascript code, which makes a request to the report engine from the client side, i.e. at the time when the page is rendered by the browser. The javascript then accepts the report output HTML content and updates one of the HTML container elements on the page (usually div element), which is placed on the page at design time. The report output is then displayed within the page as though it was generated by the server-side component. 

9-15-2011 12-42-39 AM.png

Each integration method has its advantages and disadvantages, and designers make a choice based on the closest match to the business requirements:

Integration methodAdvantages Disadvantages
Open report in a new windowEasiest to implementOne way workflow
HTTP RedirectTwo-way workflowReport template should incorporate application links
Embed in application page (using server-to-server web request)Seamless visual in-page integrationPossible extra page refresh latency beause server should aquire report content before sending the entire page content to browser
Embed in application page (using iframe)Interactive report features do not require page refresh nor special programming techniquesPage print does not include report output by default
Embed in application page (using Ajax)Better page responsivenessExtra javascript code required

References:



Arnica WebReport demo examples: