ASP.NET - Login and SingUp with LinkedIn API

In our previous blog post we looked at Login with Google plus using Google Plus API in asp.net.

Here I will explain how to integrate SingIn with LinkedIn button to asp.net web application using JavaScript API. By extending scope, we can also use this same functionality for Sign Up with Linkedin account or Linkedin login authentication for website in asp.net.

Obtain LinkedIn API key

The first step involves creating an application into LinkedIn developer portal at http://developer.linkedin.com/.

  1. Once you login to developer portal, you can find API Keys link by hovering over your name at top right corner.
  2. Clicking on 'API Keys' link, it will list out your LinkedIN application if you have created any.
  3. Click on 'Add New Application' link, which shows the form to input different information about your application.
  4. In Default scope section, checkmark the scopes related to information you want to gather from the user.
  5. In 'Javascript API domains' section: please input comma separated domains on which you are going to run this application.
  6. Click 'Add Application' button. Once application is created you can see API Key and Secret Key for that application. These keys will be needed in our asp.net code to talk with LinkedIn API.

Create an asp.net class to hold deserialized JSON data from LinkedIn

 

public class LinkedinUser
{
    public string emailAddress { get; set; }
    public string firstName { get; set; }
    public string id { get; set; }
    public string lastName { get; set; }
    public string pictureUrl { get; set; }
}

 

ASP.Net login page to show SingIn with LinkedIn button

  1. In Head section of the page, reference the LinkedIn API javascript file.
  2. Inside body, place the <script type="in/login" ... tag which automatically shows the button. Notice the data-onAuth="onLinkedInAuth" attribute, which is the callback function.
  3. Write Javascript function onLinkedInAuth to handle the SignIn callback we get as a result from LinkedIn signin dialog.

 

<head>
    <title></title>
    <script type="text/javascript" src="http://platform.linkedin.com/in.js">
        api_key: YOUR_API_KEY_HERE
        authorize: false
        credentials_cookie: true
    </script>
</head>
<body>
    <div id="linkedin_login"><script type="in/login" data-onAuth="onLinkedInAuth"><a href="#" onclick="location.reload();">Reload Page</a></script></div>
    <script type="text/javascript">
        //LinkedIn Auth Event
        function onLinkedInAuth() {
            var loc = 'callback.aspx?accessToken=' + IN.ENV.auth.oauth_token;
            window.location.href = loc;
        }
        //End LinkedIn
</script>
</body>

 

Code for callback.aspx

As we passed the access token from the first page in querystring, we can use that here to make an API call to LinkedIn oauth/accessToken method to retrieve the user's token and token secret. Which can be used in sub-sequent API calls.

 

public partial class callback : System.Web.UI.Page
{
	protected void Page_Load(object sender, EventArgs e)
	{
	    if (string.IsNullOrEmpty(Request.QueryString["access_token"])) return;

	    WebUtility oAuthLi = new WebUtility("linkedin");
	    string response = oAuthLi.oAuthWebRequest(WebUtility.Method.POST, "https://api.linkedin.com/uas/oauth/accessToken?xoauth_oauth2_access_token=" + oAuthLi.UrlEncode(Request.QueryString["accessToken"]), "");
	    string[] tokens = response.Split('&');
	    string token = tokens[0].Split('=')[1];
	    string token_secret = tokens[1].Split('=')[1];

	    //STORE THESE TOKENS FOR LATER CALLS
	    oAuthLi.Token = token;
	    oAuthLi.TokenSecret = token_secret;

	    //SAMPLE LINKEDIN API CALL
	    string url = "http://api.linkedin.com/v1/people/~:(id,first-name,last-name,email-address,picture-url)?format=json";

	    string json = oAuthLi.oAuthWebRequest(WebUtility.Method.GET, url, "");

	    JavaScriptSerializer js = new JavaScriptSerializer();
	    LinkedinUser linkedinUser = js.Deserialize<LinkedinUser>(json);
	    if (linkedinUser != null)
	    {
		Response.Write("Welcome, " + linkedinUser.emailAddress);
	    }
	}
}

 

If you are looking for expert and talented ASP.Net Programmers to integrate Linked APIs into your existing website contact us to Hire ASP.Net Developer.

You can take a look at the Demo - SignIn with LinkedIn in ASP.NET.

Loading