Configuring your ASP.NET application for Microsoft OAuth account

This post is a part of the series about how to enable and use OpenID/OAuth support that was added to the ASP.NET templates in Visual Studio 2012. In this post I am going to detail the instructions on configuring your application to use Microsoft account for authentication. I am going to be focusing on configuring the application for a development environment(using VS & IISExpress)

• Create a new ASP.NET MVC/WebForms or WebPages application  
• Build and run the website.

• Use a test domain
• You need to use a domain other than localhost since Microsoft account cannot redirect back to localhost
• Some folks have graciously reserved localtest.me for local testing of domains so you do not have to mess with hosts files. Follow the link for more information
• You can use Foo.localtest.me as a test domain. (Make sure Foo is unique. I would recommend prefixing it with something unique such as Foo<MyName>.localtest.me ). For the purpose of this article we will use Foo.localtest.me
• Ping Foo.localtest.me should be reverted back to local machine

• Edit firewall rules for port 80 to receive external requests.
• Follow the guidelines as mentioned (These work for windows8 as well)http://maximumpcguides.com/windows-7/open-a-port-in-windows-7s-firewall/

• Configuring the Microsoft live portal
• Open link https://manage.dev.live.com/AddApplication.aspx. Login using live credentials
• Enter Application name and click on I accept (Read the terms of use and privacy if it concerns you !)
• In the Live Connect Developer Center where the APP was created in step 7, click on Application Settings page link -> API settings
• In the redirectDomain enter the above created domain name. Eg: http://Foo.localtest.me
• Hit Save and the changes should be saved

• Configuring the keys in your application
• For MVC/WebForms applications
• Edit  the AuthConfig file in the App_Start folder and uncomment the code for the Microsoft OAuth provider. Copy the client ID and client secret in the AuthConfig file in the uncommented section of Microsoft login
• For WebPages applications
• Edit  the  _AppStart.cshtml file and uncomment the code for the Microsoft OAuth provider. Copy the client ID and client secret to this file in the uncommented section of Microsoft login

• Map the test domain to your application
• Now we need to add mapping for the domain name to be redirected to our application created in step 1
• For IIS Express
• Open applicationHost.config in %Documents%\IISExpress\config
• Locate the binding for the web application in the file. It will be defined in the <site> tag. For example

<site name="WebApplication5" id="6">

<application path="/" applicationPool="Clr4IntegratedAppPool">

<virtualDirectory path="/" physicalPath="pathtoapplication\WebApplication5" />

</application>

<bindings>

<binding protocol="http" bindingInformation="*:46178:localhost" />

</bindings>

</site>

• Add a new binding for port 80 and the domain name to this web application under the <bindings>
• <binding protocol="http" bindingInformation="*:80:Foo.localtest.me " />
• Restart IIS Express and relaunch the website. Test the above setting made by opening in the browser Foo.localtest.me. It should open the web application created.
• IIS (7.0) upwards
• Host you application in IIS
• Open up IIS Manager locate your web application under the Sites list and select "Bindings" from the action menu on the right. Add a binding for your chosen hostname (e.g. Foo.localtest.me ).

• Run the site to see it in action
• Make sure you are running VS as an admin for this to work
• Now launch the application either hosted in IIS Express or IIS
• Browse to the test domain Foo.localtest.me
• Navigate to Login page and login using Microsoft Live credentials. Login should be successful

Hope you have fun while integrating Microsoft Account into your applications

Cross posted to http://blogs.msdn.com/b/pranav_rastogi/archive/2012/09/19/configuring-your-asp-net-application-for-microsoft-oauth-account.aspx