Free trial *Internet Service Required

Authenticate your Windows Store app with Live Connect single sign-on

This topic shows you how to use Live Connect single sign-on to authenticate users in Windows Azure Mobile Services from a Windows Store app. In this tutorial, you add authentication to the quickstart project using Live Connect. When successfully authenticated by Live Connect, a logged-in user is welcomed by name and the user ID value is displayed.

Note

This tutorial demonstrates the benefits of using the single sign-on experience provided by Live Connect for Windows Store apps. This enables you to more easily authenticate an already logged-on user with you mobile service. For a more generalized authentication experience that supports multiple authentication providers, see the topic Get started with authentication.

This tutorial walks you through these basic steps to enable Live Connect authentication:

  1. Register your app for authentication and configure Mobile Services
  2. Restrict table permissions to authenticated users
  3. Add authentication to the app

This tutorial requires the following:

This tutorial is based on the Mobile Services quickstart. You must also first complete the tutorial Get started with Mobile Services.

Register your appRegister your app for the Windows Store

To be able to authenticate users, you must submit your app to the Windows Store. You must then register the client secret to integrate Live Connect with Mobile Services.

  1. If you have not already registered your app, navigate to the Submit an app page at the Dev Center for Windows Store apps, log on with your Microsoft account, and then click App name.

  2. Type a name for your app in App name, click Reserve app name, and then click Save.

    This creates a new Windows Store registration for your app.

  3. In Visual Studio 2012 Express for Windows 8, open the project that you created when you completed the tutorial Get started with Mobile Services.

  4. In solution explorer, right-click the project, click Store, and then click Associate App with the Store....

    This displays the Associate Your App with the Windows Store Wizard.

  5. In the wizard, click Sign in and then login with your Microsoft account.

  6. Select the app that you registered in step 2, click Next, and then click Associate.

    This adds the required Windows Store registration information to the application manifest.

  7. Log on to the Windows Azure Management Portal, click Mobile Services, and then click your mobile service.

  8. Click the Dashboard tab and make a note of the Site URL value.

    You will use this value to define the redirect domain.

  9. Navigate to the My Applications page in the Live Connect Developer Center and click on your app in the My applications list.

  10. Click Edit settings, then API Settings and make a note of the value of Client secret.

    Security Note

    The client secret is an important security credential. Do not share the client secret with anyone or distribute it with your app.

  11. In Redirect domain, enter the URL of your mobile service from Step 8, and then click Save.

  12. Back in the Management Portal, click the Identity tab, enter the Client secret obtained from Windows Store, and click Save.

Both your mobile service and your app are now configured to work with Live Connect.

Restrict permissionsRestrict permissions to authenticated users

  1. In the Management Portal, click the Data tab, and then click the TodoItem table.

  2. Click the Permissions tab, set all permissions to Only authenticated users, and then click Save. This will ensure that all operations against the TodoItem table require an authenticated user. This also simplifies the scripts in the next tutorial because they will not have to allow for the possibility of anonymous users.

  3. In Visual Studio 2012 Express for Windows 8, open the project that you created when you completed the tutorial Get started with Mobile Services.

  4. Press the F5 key to run this quickstart-based app; verify that an exception with a status code of 401 (Unauthorized) is raised.

    This happens because the app is accessing Mobile Services as an unauthenticated user, but the TodoItem table now requires authentication.

Next, you will update the app to authenticate users with Live Connect before requesting resources from the mobile service.

Add authenticationAdd authentication to the app

  1. Download and install the Live SDK for Windows.

  2. In the Project menu in Visual Studio, click Add Reference, then expand Windows, click Extensions, check Live SDK, and then click OK.

    This adds a reference to the Live SDK to the project.

  3. Open the project file mainpage.xaml.cs and add the following using statements:

    using Microsoft.Live;
    using Windows.UI.Popups;
  4. Add the following code snippet to the MainPage class:

    private LiveConnectSession session;
    private async System.Threading.Tasks.Task Authenticate()
    {
        LiveAuthClient liveIdClient = new LiveAuthClient("<< INSERT REDIRECT DOMAIN HERE >>");
    
    
    while (session == null)
    {
        // Force a logout to make it easier to test with multiple Microsoft Accounts
        if (liveIdClient.CanLogout)
            liveIdClient.Logout();
    
    
        LiveLoginResult result = await liveIdClient.LoginAsync(new[] { "wl.basic" });
        if (result.Status == LiveConnectSessionStatus.Connected)
        {
            session = result.Session;
            LiveConnectClient client = new LiveConnectClient(result.Session);
            LiveOperationResult meResult = await client.GetAsync("me");
            MobileServiceUser loginResult = await App.MobileService
                .LoginWithMicrosoftAccountAsync(result.Session.AuthenticationToken);
    
    
            string title = string.Format("Welcome {0}!", meResult.Result["first_name"]);
            var message = string.Format("You are now logged in - {0}", loginResult.UserId);
            var dialog = new MessageDialog(message, title);
            dialog.Commands.Add(new UICommand("OK"));
            await dialog.ShowAsync();
        }
        else
        {
            session = null;
            var dialog = new MessageDialog("You must log in.", "Login Required");
            dialog.Commands.Add(new UICommand("OK"));
            await dialog.ShowAsync();
        }
    }
    
    
     }

    This creates a member variable for storing the current Live Connect session and a method to handle the authentication process.

    Note

    This code forces a logout, when possible, to make sure that the user is prompted for credentials each time the application runs. This makes it easier to test the application with different Microsoft Accounts to ensure that the authentication is working correctly. This mechanism will only work if the logged in user does not have a connected Microsoft account.

  5. Update string << INSERT REDIRECT DOMAIN HERE >> from the previous step with the redirect domain that was specified when setting up the app in Live Connect, in the format https://service-name.azure-mobile.net/.

    Note

    In a Windows Store app, an instance of the LiveAuthClient class is created by passing the redirect domain URI value to the class constructor. In a Windows Phone 8 app, the same class is instantiated by passing the client ID.

  6. Replace the existing OnNavigatedTo event handler with the handler that calls the new Authenticate method:

    protected override async void OnNavigatedTo(NavigationEventArgs e)
    {
        await Authenticate();
        RefreshTodoItems();
    }
  7. Press the F5 key to run the app and sign into Live Connect with your Microsoft Account.

    When you are successfully logged-in, the app should run without errors, and you should be able to query Mobile Services and make updates to data.

Next steps

In the next tutorial, Authorize users with scripts, you will take the user ID value provided by Mobile Services based on an authenticated user and use it to filter the data returned by Mobile Services. For information about how to use other identity providers for authentication, see Get started with authentication.

Rss Newsletter