Introduction
There are various types of External Authentication services like Google, Facebook, Twitter and Microsoft available to provide membership in ASP.NET Web Pages 2. These OAuth and OpenID providers are also available in the ASP.NET Web Application and I've already explained it in External Authentication in MVC.
In that context, I am describing here to authenticate the website by using these external providers in the WebMatrix using ASP.NET Web Pages 2. You'll learn to enable the OpenID and OAuth provider in the WebMatrix here. So, let's proceed with the following sections:
- Create Starter Site in WebMatrix
- Enable Google Provider
- Enable Facebook Provider
Create Starter Site in WebMatrix
At first we need to have a Starter Site in the WebMatrix to authorize and work with the external providers. Use the following procedure to do that.
Step 1: Open the Microsoft WebMatrix and click on "New" to select a Template Gallery.
Step 2: Select the "Starter Site" and enter the site name.
It automatically creates the starter site and installs the DotNetAuth services with its default settings and you can see the newly added files and folders in your WebMatrix.
Step 3: Now launch the Default.cshtml page in the browser.
The home page of your website will open and it'll look like this:
Enable Google Provider
There are no external login services provided in the website until now. You can login with your local account. Have a look at the following screenshot:
You can enable the OAuth and OpenID external providers in the application with some editing in the code. It is recommended by Microsoft to use the Starter Site Template to get started with the external providers. It includes a full membership infrastructure, complete with a login page and a membership database.
So, let's work with Google which is the OpenID provider. You do not have to worry about creating an app on Google and Yahoo. Use the following procedure.
Step 1: Open the _AppStart.cshtml page and enable the Google provider exist at the end:
- OAuthWebSecurity.RegisterGoogleClient();
Step 2: Run the Default.cshtml page in the browser and click on "Login".
Step 3: Now in the login page click on the Google as shown below:
Step 4: It redirects you to the Google login page where you enter the credentials:
Step 5: Now Google asks to authenticate the Localhost for the website, click on "Accept".
Step 6: Now the Google token authenticates the user and with the following registration page you can associate with the Google service.
Step 7: Enter the name or email and click on register with which you are logged in with the Google account.
Enable Facebook Provider
In this section we'll authenticate the website with the Facebook service provider. So, use the following procedure to do that.
Step 1: Create the new Facebook app on the Facebook developer site.
Step 2: Copy your Website URL like http://localhost:12345.
Step 3: Now paste this URL in the Site URL of your Facebook app and click on the "Save Changes".
Note: For the complete procedure of creating an app on Facebook, you can refer to Working with Facebook App.
Step 4: Now copy your App ID and App Secret for the application that we'll use in a minute.
Step 5: Exit from the application.
The app creation part is now finished and now we can move to the next section.
Step 6: Open the _AppStart.cshtml page and enable the Facebook provider that is at the end and paste the App ID and App Secret in it as shown below:
Step 7: Now save and close the file and run the Default.cshtml page in the browser and click on "Login".
Step 8: Now in the login page click on the Facebook as shown below:
Step 9: It redirects you to the Faebook login page where you enter the credentials. You'll be prompted to authenticate the app to the confirmation as shown below.
Step 10: Now you can associate the Facebook with the site as shown below.
After the registeration you can see the user name in the Home page.
That's it.
Summary
This article has described the external authentication services for websites in the ASP.NET Web Pages 2 using Microsoft WebMatrix. Thanks for reading.