Nick Harris .NET

Devices+Services Development with Windows Azure, ASP .NET MVC, Windows 8 and Windows Phone

Main menu

Skip to primary content
Skip to secondary content
  • Home
  • Projects
  • Speaking
  • About Nick

Tag Archives: Microsoft Account

Authenticate Windows Phone app users using Microsoft Account, Facebook, Twitter and Google with Windows Azure Mobile Services

Posted on May 6, 2013 by nick.harris
Reply

Authenticate Windows Phone app users using Microsoft Account, Facebook, Twitter and Google with Windows Azure Mobile Services

Introduction

This sample demonstrates how you can easily wire up your Windows Phone application to provide login capabilities ilities for your users to authenticate against well know social identity provides such as Microsoft Account, Facebook, Twitter and Google using Windows Azure Mobile Services.

You can download the sample and follow along from here

Prerequisites

  • Visual Studio 2012 Express for Windows 8
  • and a Windows Azure account (get the Free Trial)

Building the Sample

Follow these steps to set up the sample.

Setting up the Cloud Environment

  1. Create a new Mobile Service from the Windows Azure Management Portal.To do this, log on to the Windows Azure Management Portal, navigate to Mobile Services and click New.Expand Compute | Mobile Service, and click Create.

    This displays the New Mobile Service dialog.

    In the Create a mobile service page, type a subdomain name for the new mobile service in the URL textbox and wait for name verification. Once name verification completes, select Create a new SQL Database in the Database dropdown list and click the right arrow button to go to the next page.

    This displays the Specify database settings page.

    Note: If you already have a database in the same region as the new mobile service, you can instead choose Use existing Database and then select that database. The use of a database in a different region is not recommended because of additional bandwidth costs and higher latencies.

    In Name, type the name of the new database, then type Login Name, which is the administrator login name for the new SQL Database server. Type and confirm the password, and select the check box to complete the process.

    Note: If there is a mismatch or the password you supply does not meet the minimum requirements, a warning is displayed.

    You have now created a new mobile service that can be used by your mobile apps.

  2. Register the sample application for authentication and configure Mobile Services. To do this, follow the instructions in https://www.windowsazure.com/en-us/develop/mobile/tutorials/get-started-with-users-dotnet/#register.

    Note: The link above provides details on how to register the sample application with Microsoft Account, Facebook, Twitter and Google identity providers, and explains how to register the provider-generated client secret with Mobile Services.

Setting up the Local Environment

  1. Configure the Mobile Service URL and access key.Get the Mobile Service URL and Mobile Service Key values. Browse to your Mobile Service dashboard, copy the service URL and click Manage Keys on the bottom bar.Mobile Service URL

    Now copy the Application Key value.

  2. In Visual Studio 2012 Express for Windows Phone, open the Authentication.sln solution
  3. Right Click on the Authentication project and select Manage Nuget Packages
  4. In the Manage Nuget Packages Dialog change the dropdown from Stable Only > Include Prerelease and Search for WindowsAzure.MobileServices.  Select it and click Install (Note: at the time of writing April 26, 2013. The PCL nuget for Mobile Services was pre-release.  By the time you are reading this it may already be released as stable)
  5. Open the App.xaml.cs file
  6. Add a using statement for the MobileServices namespace
  7. using Microsoft.WindowsAzure.MobileServices;
  8. Supply the URL and add a using statement  application key from the mobile service in the MobileServiceClient constructor.
    private static MobileServiceClient mobileService = new MobileServiceClient(
    "https://{YOUR-MOBILE-SERVICE-NAME}.azure-mobile.net/",
    "{YOUR-APPLICATION-KEY}");
  9. Open the MainPage.xaml.cs file
  10. Add a using statement for the MobileServices namespace

    using Microsoft.WindowsAzure.MobileServices;
  11.  Update method OnBtnMicrosoftAccountClick to call LoginAsync

    //Call LoginAsync for the given Auth Provider
    await App.MobileService.LoginAsync(MobileServiceAuthenticationProvider.MicrosoftAccount);
    
    //Log the logged in userId
    txtStatus.Text = string.Format("Logged in with: {0}", App.MobileService.CurrentUser.UserId
  12.  Update method OnBtnFacebookAccountClick to call LoginAsync

    //Call LoginAsync for the given Auth Provider
    await App.MobileService.LoginAsync(MobileServiceAuthenticationProvider.Facebook);
    
    //Log the logged in userId
    txtStatus.Text = string.Format("Logged in with: {0}", App.MobileService.CurrentUser.UserId);
  13.  Update method OnBtnTwitterAccountClick to call LoginAsync
    //Call LoginAsync for the given Auth Provider await App.MobileService.LoginAsync(MobileServiceAuthenticationProvider.Facebook); //Log the logged in userId txtStatus.Text = string.Format(“Logged in with: {0}”, App.MobileService.CurrentUser.UserId);
  14. Update method OnBtnGoogleAccountClick to call LoginAsync

    //Call LoginAsync for the given Auth Provider
    await App.MobileService.LoginAsync(MobileServiceAuthenticationProvider.Google);
    
    //Log the logged in userId
    txtStatus.Text = string.Format("Logged in with: {0}", App.MobileService.CurrentUser.UserId);
  15. Update OnBtnLogoutClick to perform a logout operation

    //If there is an authenticated user then logout
    if (App.MobileService.CurrentUser != null && App.MobileService.CurrentUser.UserId != null)
    App.MobileService.Logout();

Running the Sample

  1. In Visual Studio, press the F5 key to run the application.
  2. In the start page, Click on the button for the authentication scenario you wish to exercise.
  3.  An authentication dialog box will be displayed prompting you to enter the credentials of the selected identity provider.
  4. A consent message requesting access to the application is shown the first time you log in to your account.  Click Authoriz
  5. After the user is authenticated, the user id is shown in the output area.
  6.  Click the Logout button to log the user out before trying out another identity provider.

If you cant find a specific Windows Azure Mobile Services scenario using Windows Phone please feel free to reach out to me on Twitter via @cloudnick

Posted in Azure, C#, Mobile, Mobile Services, Windows Phone | Tagged Auth, Azure, Facebook, Google, Microsoft Account, Mobile Services, Twitter, Windows Phone | Leave a reply
Nick Harris is a Senior Technical Evangelist at Microsoft specializing in Windows Azure. Before Microsoft, he founded his own startup AdGAC a mobile advertising company developed utilizing Windows Azure, WP7 and ASP.NET MVC. In the 9 years prior, Nick worked as both a consultant and Senior Software Engineer delivering smart client applications, distributed enterprise applications and airborne software systems. While not working you can find him blogging or on Twitter about Windows Azure along with a diverse range of related technical content.

Follow Nick

TwitterLinkedInRSS

Recent Posts

  • Programmatically upload and configure a SSL certificate for an Azure Cloud Service Deployment
  • How to develop Windows 8.1 Apps with Windows Azure Mobile Services
  • Opsgility announces instructor led Windows Azure Training
  • Updated NotificationsExtensions WnsRecipe Nuget to support Windows 8.1 templates now available
  • How to implement Periodic Notifications in Windows Store apps with Azure Mobile Services Custom API
  • BUILD 2013 session recap
  • How to handle WNS Response codes and Expired Channels in your Windows Azure Mobile Service
  • TechEd North America 2013 sessions
  • Mums and Ayrtons Stories
  • Faster Save Experience Editing Scripts in the Windows Azure Mobile Services Portal

Blog Post Archive

  • April 2014 (1)
  • January 2014 (1)
  • November 2013 (1)
  • August 2013 (5)
  • June 2013 (1)
  • May 2013 (2)
  • March 2013 (1)
  • February 2013 (4)
  • January 2013 (1)
  • December 2012 (1)
  • November 2012 (1)
  • October 2012 (2)
  • September 2012 (1)
  • June 2012 (3)
  • April 2012 (4)
  • March 2012 (2)
  • December 2011 (1)
  • November 2011 (1)
  • October 2011 (1)
  • September 2011 (1)
  • August 2011 (1)
  • June 2011 (1)
  • April 2011 (6)
  • March 2011 (4)
  • February 2011 (4)
  • January 2011 (9)
  • December 2010 (3)
  • November 2010 (11)
  • October 2010 (6)
  • September 2010 (12)
  • August 2010 (11)
  • July 2010 (3)
  • June 2010 (2)
  • May 2010 (6)
  • April 2010 (8)
  • March 2010 (15)
  • February 2010 (3)
  • January 2010 (2)
Proudly powered by WordPress