In our previous blog post, we discussed Signing in with Google and using the Google Plus API at asp.net.Here I will explain how to integrate SingIn with LinkedIn button to asp.net web application using JavaScript API. By extending the reach, we can also use this same functionality to Register with a Linkedin account or Linkedin login authentication for the website at asp.net.

Get the LinkedIn API key

The first step is to create an application on the LinkedIn developer portal at http://developer.linkedin.com/.

  1. Once you log in to the developer portal, you can find the API Keys link by hovering over its name in the upper right corner.
  2. When you click on the ‘API Keys’ link, a list of your LinkedIN application will appear if you have created one.
  3. Click the ‘Add New App’ link, which displays the form to enter different information about your app.
  4. In the Default scope section, check the scopes related to the information you want to collect from the user.
  5. In the “JavaScript API Domains” section: Enter the comma separated domains this application will run on.
  6. Click on the ‘Add Application’ button. Once the application is created, you can see the API key and the secret key for that application. These keys will be needed in our asp.net code to talk to the LinkedIn API.

Create an asp.net class to store 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 display SingIn button with LinkedIn

  1. In the Head section of the page, reference the LinkedIn API javascript file.
  2. Inside the 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.

    
    
        api_key: YOUR_API_KEY_HERE
        authorize: false
        credentials_cookie: true
    


        //LinkedIn Auth Event
        function onLinkedInAuth() {
            var loc = 'callback.aspx?accessToken=' + IN.ENV.auth.oauth_token;
            window.location.href = loc;
        }
        //End LinkedIn

Code for callback.aspx (Login and Sign Up with the LinkedIn API)

As we pass the access token for the first page in the query string, we can use it here to make an API call to LinkedIn's oauth / accessToken method to retrieve the token and secret from the user's token. Which can be used in subsequent 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(json);
	    if (linkedinUser != null)
	    {
		Response.Write("Welcome, " + linkedinUser.emailAddress);
	    }
	}
}

If you are looking for skilled and talented ASP.Net programmers to integrate linked APIs into your existing website, please contact us to hire an ASP.Net developer.

Leave a Reply