TechBlog: Windows Azure Active Directory Access Control Configuration
If you’re creating a new web or mobile app, you’re most likely asking your users to register and log-in. It’s part of life in the Internet. What if you could make life easier for your users and let them log-in to your app via their preferred social media channels like Windows Live, Yahoo!, Google or Facebook? Windows Azure, in fact, does this with its own out-of-the box authentication mechanism.
In this article, we’re going to show you how you can configure Active Directory Access Control Configuration to make a single log-in using Google, Yahoo! and Microsoft credentials. Here is the menu of steps to complete this followed by detailed instructions:
Step 1: Create Active Directory and ACS
Step 2: Create an Empty MVC 4 Application, Create – Controller, Model and Views
Step 3: Integrate your MVC4 application with Microsoft Azure using Identity and Access in Visual Studio
Step 4: Add a different Identifier Providers (Google, Yahoo, etc.,) in Microsoft Azure Portal
Step 5: Log in to the hosted website and ensure everything works fine
So, for Step 1 – Create Active Directory and ACS:
- Log into the Windows Azure Management Portal
- Create Active Directory And ACS
- App Service > Active Directory > Access Control > Quick Create
- Enter a name for the namespace. Windows Azure verifies that the name is unique.
Namespace: To use Active Directory Access Control in Windows Azure, create an Access Control namespace. The namespace provides a unique scope for addressing ACS resources within your application.
- Select the region in which the namespace is used. For best performance, use the region in which you are deploying your application, and then click Create.
Region: Region is the location of the server.
Now, for Step 2 – create an Empty MVC 4 Application, Create Controller, Model and Views:
- Start Visual Studio 2012 or Visual Studio Express for Web 2012 (note: previous versions of Visual Studio will not work with this tutorial since Frameworks 4.5 is needed)
- Click File and then click New Project
- Select the Visual C#/Web template, and then select ASP.NET MVC 4 Web Application
- In Name, type “Your Project Name”, and then click OK
- In the next dialog, select Empty Application, Engine – Razor/Aspx (note: either one can be used)
And then click OK.
- Create a Controller with Name “Home”
- Add a view with the Name “Index”
- Update the Actions “Index” in HomeController with the following code:
And here’s Step 3 – integrate your MVC4 application with your Azure using Identity and Access.
In this task, you will integrate your ASP.NET web application with ACS. In the Solution Explorer, right-click the project, and then select Identity and Access. If the Identity and Access option does not appear on the context menu, install the Identity and Access Tool. For information, see Identity and Access Tool.
We’re using Azure Access Control Service, so we’ll select the option “Use the Windows Azure Control Service”.
After selecting the Provider Option, click on the link button “Configure” to configure the Namespace and Symmetric Key.
Visual Studio requests information about the Access Control namespace. Enter the namespace name you created earlier. (Test in this image above, but you will have a different namespace.) Switch back to the Windows Azure Management Portal to get the symmetric key.
In the Windows Azure Management Portal, click the Access Control namespace and then click Manage.
Click Management Service and then click Management Client.
Click Symmetric Key, click Show Key, and copy the key value. Then, click Cancel to exit the Edit Management Client page without making changes.
In Visual Studio, paste the key in the Enter the management Key for the namespace field and click Save management key, and then click OK.
- Visual Studio uses the information about the namespace to connect to the ACS Management Portal and gets the settings for your namespace, including the identity providers, realm and return URL.
- Select Windows Live ID (Microsoft account) and click OK.
Press F5 in Visual Studio to run the app. Here the login page will have only Windows Live ID.
Now for Step 4 – Add different Identifier Providers (Google, Yahoo, etc.). Once again click on Manage.
Click Relying Party Applications. The new “Project Name” application appears in the list of relying party applications. The realm is automatically set to the application main page.
Click “Project Name”. The Edit Relying Party Application page contains configuration settings for the “Project Name” web application. When you change the settings on this page and save them, the changes are immediately applied to the application.
Click Identity Providers (in the navigation menu) and then click Add.
Click Google and then click Next. The MvcACS app checkbox is selected by default. Here, you’ll be able to add only one provider at a time.
In Visual Studio, once again, right-click in the project and open Identity and Access. Click the Providers available and needed for your project.
Finally Step 5 – Log in to the hosted website and ensure everything is working ok. After completing the steps, hit F5 to run the application. This is the Page from ACS for Single Log-in.
These same steps apply for Yahoo.
Next, after you click Google, it will ask for your permission to proceed.
Once you click on “Accept,” it goes to our Index View, which then shows we are authenticated properly and ACS works fine.
This post hopefully shows you how to configure the Azure Active Directory Access Control and allow users to log in using their Google, Yahoo or Windows Live ID.