Silverlight 3 with WCF RIA Authentication service

Authentication and authorization plays a key role in the web world. Going distributed makes information sharing healthier. But only if it's allowed for the know contact it will be healthy. We can very well see this in the existing web world. We have the memberships and roles for ASP.Net web applications. In addition we also have forms authentication and NTLM authentication.

Going smart client is always best. But considering security it has to be more secure since smart clients attract all the people they can be easily prey to security vulnerabilities. Ria services is one of the fantastic releases from Microsoft (though its still in beta stage) to achieve this. Its nothing but a platform to bring all the capabilities from ASP.Net web to the Silverlight .It actually tries to show a showcase a two-tier applications and behind the scene handling all the things necessary to build a three tier application. All this can be achieved by one thing called Domain Service. Thisarticle is aimed at showing how we can authenticate our Silverlight applications with ASP.Net membership objects.

Sources reffered:

1. Brad Adam's Posting
2. EggHead cafe
3. silverlight-show

I referred from all these links. Even Microsoft offer's a sample application in the Ria download page.

ASP.Net Security:

Create a new Silverlight Project called "AuthenticLight" with Web application enabled. ASP.Net offers an easy way of integrating security into web application. This we can be set up from the ASP.Net configuration in the menu. Below picture depicts that.

Selecting this option will open a web page with all the security features that a web application needs. It enables you to create the following options

• Authentication
• Role Based Authorization

You can refer this link User Profile . This link also shows how to customize this feature.

There will be a wizard interface for creating a new user with username, passwords, roles and role access filters. Refer below pictures in the wizard.

Fig-1 (Select security tab)

Fig-2 (Selecting the Security wizard to create the user)

Fig-3 (Select the Internet option)

Fig-4 (Provider)

Here you can customize the provider to any DB or XML source. If we left for default then an ASPNETDB.MDF will be created in the APP_Data folder in the web application. This will have all the user related tables. Next wizard is about the Roles and it has to be enabled if it's needed. Following that will ask for the role name details.

Fig-5(Role Names)

Fig-6(New User details)

Fig-7(Role and access rights)

Finishing this will finish the user creation wizard. Now we are ready with the userdb setup and to expose them for Silverlight through DomainService.

Exposing AuthenticationBase with DomainService :

Authentication base is the new class found in the System.Web.Ria.ApplicationServices. This enables us to expose the secuiryt services to the SilverlightClient. Try adding a new Domainservice class to the ASP.Net Web application ("AuthenticLight.Web"). Name this "AuthenticationSrv". The code will be looking like as follows.

namespace AuthenticLight.Web

{

    using System;

    using System.Collections.Generic;

    using System.ComponentModel;

    using System.ComponentModel.DataAnnotations;

    using System.Linq;

    using System.Web.Ria;

    using System.Web.Ria.ApplicationServices;

    using System.Web.Ria.Data;

    using System.Web.DomainServices;

    // TODO: Create methods containing your application logic.

    [EnableClientAccess()]

    public class AuthenticationSrv : AuthenticationBase<UserBase>

    {

    }

}

The UserBase which is from System.Secuirty.Principle will be exposed through the AuthenticationBase Class. Userbase has the following methods.

1. AuthenticationType
2. IsAuthenticated
3. Name
4. Roles
5. IsInRole

The AuthenticationSrv is the class that's intended to expose the User classes. Hence we add the EnableClientAccess()attribute to this class. Authentication base inherits from the DomainService class . So there's no need to worry about implementing the Domainservice Class here.Authentication base has the following methods available with them.

1. ClearAuthenticationToken
2. CreateUser
3. GetAnonymousUser
4. GetAuthenticatedUser
5. GetUser
6. IssueAuthenticationToken
7. Login
8. Logout
9. UpdateUser
10. UpdateUserCore
11. ValidateUser

These are the basic methods needed to validate the user credentials. When exposing them through the EnableClientAccess they will create the proxy classes at the client side i.e Silverlight Applciation side. The generated code file will have the name "AuthenticLight.Web.g.cs". The project structure will be like the following picture.

The Silverlight application created for this demo is created with "Silverlight Navigation Application". If you want more info on Navigation you can check my Article.

There's a few change that needs to be done on the ASP.Net page where the Silverlight page is referred .Remove the entries for registering System.Web.Silverlight and make the following changes.

<%@Register Assembly="System.Web.Ria"Namespace="System.Web.Ria" TagPrefix="ria"%>

Replace this code where its referred as <asp:Silverlight…

<ria:SilverlightApplication ID="Silverlight1" runat="server"

    Source="~/ClientBin/AuthenticLight.xap" MinimumVersion="3.0.40307.0" 

    Width="100% "Height="100%"/>

The final page will look like this.

<%@Page Language="C#"AutoEventWireup="true"%>

<%@Register Assembly="System.Web.Ria" Namespace="System.Web.Ria" TagPrefix="ria"%>

<!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 runat="server">

    <title>AuthenticLight</title>

    <style type="text/css">

        html, body {

            height: 100%;

            overflow: auto;

        }

        body {

            padding: 0;

            margin: 0;

        }

    </style>

    </head>

    <body>

        <form id="form1" runat="server" style="height:100%;">

            <asp:ScriptManagerID="ScriptManager1"runat="server"></asp:ScriptManager>

            <div style="height:100%;">

            <ria:SilverlightApplication ID="Silverlight1" runat="server" Source="~/ClientBin/AuthenticLight.xap"

                MinimumVersion="3.0.40307.0" Width="100%" Height="100%"/>

            </div>

        </form>

    </body>

</html>

For calling this Authentication service WebUserService has to be referenced from "App.Xaml" as a service. So add the following changes in the "App.Xaml"

<Application.Services>

    <appsvc:WebUserService x:Name="UserServ">

    </appsvc:WebUserService>

</Application.Services>

<Application.Resources>

Now in the Silverlight Application wherever there's a need to call the UserService then refer the Namespace

using System.Windows.Ria.ApplicationServices;

Referring this will enable the developer to call the user Service like

UserService.Current.Login

UserService.Current.LogOut()

…

Silverlight Client code sample below.

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

using System.Windows.Navigation;

using System.Windows.Ria.ApplicationServices;

namespace AuthenticLight

{

    public partial class HomePage : Page

    {

        public HomePage()

        {

            InitializeComponent();

        }

        // Executes when the user navigates to this page.

        protected override void OnNavigatedTo(NavigationEventArgs e)

        {

        }

        private void lgOut_Click(object sender, RoutedEventArgs e)

        {

            UserService.Current.Logout();

            UserService.Current.LogoutCompleted += this.HandleCompletionEvent;

        }

        private void HandleCompletionEvent(Object Sender, EventArgs e)

        {

            if(!AuthServ.IsUserAuth())

            {

                this.NavigationService.Navigate(newUri("/Views/LoginPage.xaml", UriKind.Relative));

            }

        }

        private void Page_Loaded(object sender, RoutedEventArgs e)

        {

            if (!AuthServ.IsUserAuth()) 

            {

                this.NavigationService.GoBack();

        }

    }

}

Like this we can use them in silverlight application wherever needed. You can find a demo here. There's a login page in this application which validates the username and password and then it allows the user to move around all other pages.

Conclusion:

The Article has demonstrated how one can use the ASP.Net role and membership for Silverlight application through .Net Ria service's. I will come back with some more advanced concepts on how we can customize these features for need's. Please bare with me if there is any mistakes and let me know so that I can correct them.

Thanks,

Thanigainathan Siranjeevi