Click here to Skip to main content
15,879,095 members
Articles / Web Development / HTML

A More Flexible and Secure Method to Configure Silverlight Applications Using the Web.config File from ASP.NET

Rate me:
Please Sign up or sign in to vote.
4.18/5 (7 votes)
3 Feb 2010CPOL6 min read 33.3K   182   29   1
This article introduces a more flexible and secure method to configure Silverlight applications using the Web.config file from the ASP.NET host application.

Introduction

This article introduces a more flexible and secure method to configure Silverlight applications using the Web.config file from the ASP.NET host application.

Background

In my earlier article "Configure Silverlight 3 Applications using the Web.config File from ASP.NET", I introduced a method to pass configuration information to the Silverlight application from the Web.config file in the ASP.NET host application. I noticed two problems with the method:

  1. It is less secure as the configuration information is written as plain text into the host ASPX page.
  2. It has difficulty handling special characters like "=" and comma, because it uses comma delimited name value pairs separated by "=" to transfer configuration information.

Some readers also pointed out that the application has some difficulty working in Firefox. This is not a problem with Silverlight, but a problem with Firefox. In this article, the application shows up in Firefox on my computers after I made some small changes to the host ASP.NET page.

Although we have workarounds for all these problems, it is still better not to have these problems at the first place.

This article is to introduce a more flexible and secure method to configure Silverlight applications using the Web.config file from the ASP.NET host application. The idea in this article is to use a WCF service to pass the configuration information to the Silverlight application. The WCF service will be created inside the ASP.NET host application, so the Silverlight application can use "relative path" to access the WCF service. At deployment time, as long as the WCF service is deployed together with the host ASPX page, the Silverlight application will have no problems to locate and use it. We will not have any portability issues with the method introduced in this article because the access to the WCF service is by "relative path".

I will not go into the details of how to create Silverlight applications in Visual Studio. If you are not familiar with it, you can refer to the articles "Configure Silverlight 3 Applications using the Web.config File from ASP.NET" and "A Simple Flexible Silverlight Splash Screen". If you are not familiar with how to create WCF services and consume them in Silverlight applications, you can refer to "Concurrent Development of Silverlight and WCF Applications in the Same Visual Studio Solution".

The sample code in this article is very similar to the one in "Configure Silverlight 3 Applications using the Web.config File from ASP.NET", with three major differences:

  1. The ASP.NET Literal object in Default.aspx to pass InitParams to the Silverlight application has been removed. It is no longer used in this article.
  2. A WCF service, "SilverlightConfiguration.svc", is created in the ASP.NET host application to read the configuration information from the Web.config file.
  3. In the Silverlight application, the configuration information is obtained by calling the WCF service with a "relative path".

The sample code is written in Visual Studio 2008 and Silverlight 3.

The Overall Structure of the Sample Visual Studio Solution

Solution Explorer

From the above picture, we can see that the Visual Studio solution has two projects. One is the Silverlight application, the other is the ASP.NET host application. In the ASP.NET project, we have the following major components:

  1. The Default.aspx file that hosts the Silverlight application.
  2. The "ISilverlightConfiguration.cs" and "SilverlightConfiguration.svc" files that provide the WCF service for the Silverlight application to get the configuration information.
  3. The Web.config file where the configuration information is written.

In the Silverlight project, we can see the following:

  1. A C# file, "WCFServiceFactory.cs", to implement a simple class to create a reference interface to the WCF service.
  2. The "App.xaml.cs" file, where the WCF service is called to retrieve the configuration information.

Now, I will give some detailed explanations. I will start with the ASP.NET host application.

The Host ASP.NET Application Project

In the ASP.NET application, the Silverlight application is hosted in the Default.aspx file. Since we are no longer passing information using the "InitParams" parameter like in "Configure Silverlight 3 Applications using the Web.config File from ASP.NET", the ASP.NET Literal object has been removed.

ASP.NET
<%@ Page Language="C#" AutoEventWireup="true" EnableViewState="false"
    CodeBehind="Default.aspx.cs" 
    Inherits="SilverlightBetterConfigurationWeb.Default" %>
   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>Silverlight Configuration Demonstration</title>
    
    <!-- Link the Microsoft generated style -->
    <link href="Styles/SilverlightDefault.css" rel="stylesheet" type="text/css" />
    
    <!-- Link the Microsoft generated JAVA scripts -->
    <script src="JS/Silverlight.js" type="text/javascript"></script>
    <script src="JS/SilverlightDefault.js" type="text/javascript"></script>
</head>
 
<body>
    <form id="frmMain" runat="server">
    <div style="text-align: center">
        <object data="data:application/x-silverlight-2,"
            type="application/x-silverlight-2"
            width="700px" height="500px">
    <param name="source" value="ClientBin/SilverlightBetterConfiguration.xap"/>
    <param name="onError" value="onSilverlightError" />
    <param name="background" value="white" />
    <param name="minRuntimeVersion" value="3.0.40624.0" />
    <param name="autoUpgrade" value="true" />
    <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" 
          style="text-decoration:none">
          
      <img src="http://go.microsoft.com/fwlink/?LinkId=108181" 
        alt="Get Microsoft Silverlight" style="border-style:none"/>
    </a>
     </object>
     
     <iframe id="_sl_historyFrame" 
       style="visibility:hidden;height:0px;width:0px;border:0px">
     </iframe>
    </div>
    </form>
</body>
</html>

Another thing to notice is that the "width" and "height" of the "<object>" to embed the Silverlight application are specified in absolute values to be compatible with Firefox. In Firefox, if relative values like "100%" are specified, the Silverlight application will not be visible.

The configuration information in the Web.config file is:

XML
<appSettings>
 <add key="ApplicationName" value="A Better Silverlight Configuration Demonstration"/>
 <add key="WCFEndPointAddress" value="http://localhost/HelloService/MyService"/>
 <add key="AnotherWCFEndPointAddress"
  value="http://localhost/AnotherService/MyanotherService"/>
 <add key="Author" value="Song Li"/>
 <add key="Version" value="1.0.0.0"/>
 <add key="DeploymentTime" value="02/01/2010"/>
 <add key="CopyRight" value="The Code Project Open License (CPOL)"/>
 <add key="OtherSilverlightApplicationInfo"
  value="Whatever needed to send to Silverlight application @ deployment time"/>
</appSettings>

The interface of the WCF service is very simple. It defines only one "OperationContract" that returns to the Silverlight caller an object of type Dictionary.

C#
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.Text;

namespace SilverlightBetterConfigurationWeb
{
    [ServiceContract]
    public interface ISilverlightConfiguration
    {
        [OperationContract]
        IDictionary<string, string> GetConfiguration();
    }
}

The implementation of the above interface is in the "SilverlightConfiguration.svc.cs" file.

C#
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.Collections.Specialized;
using System.ServiceModel;
using System.Configuration;
using System.Text;

namespace SilverlightBetterConfigurationWeb
{
    public class SilverlightConfiguration : ISilverlightConfiguration
    {
        public IDictionary<string, string> GetConfiguration()
        {
            Dictionary<string, string> configuration = 
                               new Dictionary<string, string>();
 
            NameValueCollection appSettings = ConfigurationManager.AppSettings;
            for (int Idex = 0; Idex < appSettings.Count; Idex ++)
            {
                configuration.Add(appSettings.GetKey(Idex), appSettings[Idex]);
            }
 
            return configuration;
        }
    }
}

The "GetConfiguration" method reads the configuration information from the Web.config and passes it over to the Silverlight application.

Get the Configuration Data in the Silverlight Application by Calling the WCF Service

In the Silverlight application, I created a class named "WCFServiceFactory" to make the code consume the WCF service cleaner.

C#
using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.ServiceModel;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace SilverlightBetterConfiguration
{
    public class WCFServiceFactory
    {
        public SilverlightConfiguration.ISilverlightConfiguration 
               iConfigurationService
        {
            get
            {
                BasicHttpBinding basicHttpBinding = new BasicHttpBinding();
                EndpointAddress endpointAddress = 
                    new EndpointAddress(new Uri(Application.Current.Host.Source, 
                        "/SilverlightConfiguration.svc").AbsoluteUri);
 
                return new 
                  ChannelFactory<SilverlightConfiguration.ISilverlightConfiguration>
                  (basicHttpBinding, endpointAddress).CreateChannel();
            }
        }
    }
}

It is important to notice that only the "relative path" of the WCF service is used to create the "EndpointAddress". In this article, the "relative path" is simply the name of the file to implement the WCF service, which is "SilverlightConfiguration.svc". This means that we do not need to make any changes to the Silverlight application or the WCF service, regardless of where the ASP.NET host application is deployed.

Similar to "Configure Silverlight 3 Applications using the Web.config File from ASP.NET", the configuration information is obtained from the "App.xaml.cs" file and stored in a globally accessible variable, DeploymentConfigurations, in the App class.

C#
public IDictionary<string, string> DeploymentConfigurations;

private void Application_Startup(object sender, StartupEventArgs e)
{
 SilverlightConfiguration.ISilverlightConfiguration iConfigurationService = 
  (new WCFServiceFactory()).iConfigurationService;
 
 AsyncCallback aSyncCallBack = delegate(IAsyncResult result)
 {
    try
    {
        DeploymentConfigurations =
            ((SilverlightConfiguration.ISilverlightConfiguration)
              result.AsyncState).EndGetConfiguration(result);
    }
    catch (Exception ex)
    {
        Deployment.Current.Dispatcher.BeginInvoke(() => MessageBox.Show(ex.Message));
        return;
    }
 };
 
 iConfigurationService.BeginGetConfiguration(aSyncCallBack, iConfigurationService);
 
 this.RootVisual = new MainPage();
}

Run the Application

We have now completed the majority of the demo code development. The rest of the work is exactly the same as what we have seen in "Configure Silverlight 3 Applications using the Web.config File from ASP.NET". Set "SilverlightBetterConfigurationWeb" as the Startup project, and set Default.aspx as the Start page, and we can debug run the application. The following screenshot shows the application running in Firefox:

Run Application

Click on the button "Display Configuration Information", and all the information configured in the Web.config file is shown in the DataGrid. Click on the button "Get Application Name from Configuration", and a message box shows up showing the application name: "A Better Silverlight Configuration Demonstration".

Points of Interest

Compared with the earlier article, "Configure Silverlight 3 Applications using the Web.config File from ASP.NET", the method introduced here resolves two problems.

  1. The information passed to Silverlight is no longer visible to anyone from the host "ASPX" page in the user's web browser, thus making it a more secure method.
  2. Using special characters like "=" and comma is no longer a problem.

Beyond solving the two problems, the method in this article is more secure because of the built-in security feature of WCF services, disallowing any cross-domain access and enforcing "HTTPS" between the web browsers and the web server.

During the study of this subject, I did some search on the internet. I found out that we need to set the absolute size for the Silverlight object in the host ASP.NET page to make it visible in Firefox. We may need to further confirm this, but the Silverlight application at least shows up in Firefox on my computers, and functions well.

History

This is the first revision of the article.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
United States United States
I have been working in the IT industry for some time. It is still exciting and I am still learning. I am a happy and honest person, and I want to be your friend.

Comments and Discussions

 
GeneralRegarding to HTTPS Pin
Dr. Song Li3-Feb-10 15:04
Dr. Song Li3-Feb-10 15:04 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.