LiveID on the Web v’s the Windows LiveID Client SDK

Over the past year Microsoft has really jumped onto the whole cloud computing bandwagon.  Personally I’m glad that someone has the common sense to realise we should not be content with mediocre web applications where the usability, at the best of times, is constrained by the availability and speed of your connection. Anyone who has built occasionally connected software will be aware of the pains associated with authentication, connectivity, data synchronisation and of course deployment.  I’m not going to drill into all of these but I do want to look at LiveID as at least a partial solution to authenticating application users.

Firstly, why LiveID?  I guess to me the biggest reason to use LiveID is that it is an existing, well understood and well used, authentication system.  A large proportion of individuals will already have LiveIDs because they use Live Messenger or they use another of Microsoft’s online services.

The other reason to use LiveID is that you can integrate it into both your web site and your rich client application. In this post I’m go through how you can do both, where the process falls apart and what you can do to stitch it back together.

Let’s start by creating a new website and integrating LiveId into it.  To begin with, if you haven’t already, download and install the Windows Live Tools for Visual Studio (at time of writing this is the July CTP). Now create a new web application in Visual Studio 2008.  There is no need to do this with a new web application and you should be able to follow a similar process for integrating LiveId into your existing web application.

image

You should have a new Toolbox tab entitled “Windows Live” which includes ASP.NET wrapper controls for the Windows Live pieces.  To work with LiveId, drag the IDLoginStatus control from the Toolbox onto Default.aspx. The first thing you will notice is that there is a smarttag directing you to “Create new Application ID.” In order for your web application to use LiveID to authenticate users it needs to be identified as a Live Id application.

image

Selecting the smarttag will open a modal dialog that allows you to Register an Application.

image

This dialog is just a web browser control accessing the Windows Live ID application page.  There is also more information on LiveId and using it on your website via the Getting Started paper in the Windows Live SDK on MSDN.

From this dialog, click the “Register an Application” link. You may at this point need to sign in with your Live Id.

image

Fill in the Register an Application form.  Here you can see that I’ve just used http://localhost/LiveIdWebApplication/Default.aspx as the return url and I’ve left the domain name field empty.  These values will work for debugging only.  When you deploy your application you will either need to create a new application id or change these values.

image

The other thing to note here is the Secret Key.  To use LiveId on your web application you need to have your secret key (aka the application secret) and the application id (this is generated when you complete the Register an Application form. When you have entered all the details you can click Submit to continue.

image

At this point the Application ID and Application Secret fields at the bottom of the dialog will be populated and you can click Ok to save these values into your web.config file.

Before you run your web application to test that the LiveId integration is working you will need to change your project so that it runs under IIS.  To do this double-click the Properties item in Solution Explorer.  On the Web tab, select “Use Local IIS Web server” in the Servers area and click Create Virtual Directory.

image

When you press F5 to run your application you will see a couple of things.  Assuming this is the first time you have run the application you will get the standard “do you want to enable debugging in the web.config” dialog.  Then you will see your application attempt to load in IE before crashing.

image

But you’ve done everything right, so why the crash! Well, the current CTP doesn’t do any checking to ensure you have a ScriptManager on the page.  As this is required, you need to manually drag one onto your web form from the AJAX Extensions tab.

image

Now you are ready to run your application which will allow you to sign in and out of LiveId.

This is the first in a couple of articles where I explore LiveId and how you can use it as part of your Cloud application architecture.

Leave a comment