Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

Adding Linkedin Login Button to Website using JavaScript API in Asp.net

May 9, 2013
Introduction

Here I will explain how to add or integrate Linkedin login button to web application using JavaScript API in asp.net or Sign in with Linkedin account or Linkedin login authentication for website in asp.net.

Description:
   

In previous posts I explained Asp.net integrate facebook login authentication to websiteAdd twitter login authentication to website,  jQuery Allow only numbers in textbox, jQuery disable cut copy and paste options in textbox, jQuery Create Rounded Corners Textbox, jQuery slideUp, slideDown and slideToggle Example and many articles relating to JQuery, JavaScript, Asp.net. Now I will explain how to integrate Linkedin login button to web application using JavaScript API in asp.net.

Before implement Linkedin login authentication first we need create Linkedin application and need to get api key from Linkedin for that open this link https://www.linkedin.com/secure/developer once you open that link we have option like “Add New Application” click on it that will display window like this


Here you need to mention your website url in Website URL field and JavaScript API Domain fields like as shown below and above figures



Once you enter all the details click ok now api key will generate for your application. Now open your application and write the following code in your aspx page


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Linkedin Authentication Login in Asp.net Website</title>
<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: Your_API_KEY
</script>
</head>
<body>
<form id="form1" runat="server">
<script type="in/Login">
Hello, <?js= firstName ?> <?js= lastName ?>.
</script>
</form>
</body>
</html>
In header section replace Your_API_KEY with your api key. Once we run above code we will get output of Sign in Button like as shown below



Once we click on that button another window will open and it will ask access permission for that application for your details like as shown below

Once you click the Allow access button you will get output like as show below

Demo

In this way we can implement Linkedin authentication for your web application.

Here you need to remember one point that is once you get the output please try to refresh your page for few times you will notice that login button reappears every time, even though you have already logged into the app and granted permission. By default, Linkedin framework will only fetch an OAuth token if the user explicitly clicks a Sign In button. You can override this to auto-login signed in users for that set the option authorize: true, and the framework will automatically fetch an OAuth token if one is available (i.e. if the user has previously authorized your application). For that you need to change header script code like as shown below

<script type="text/javascript" src="http://platform.linkedin.com/in.js">
api_key: Your_API_KEY
authorize: true
</script>
In this way we can implement linkedin authentication mechanism for website.

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

10 comments :

;l;'l said...

k;;lk;kl;k;

Anonymous said...

<script>alert('Check It Out')</script>

Anonymous said...

Sir, How to set a default man's image when a radio button's text is male? When female is selected a women's image must appear as a default image in asp.net. Radio button1 text----->Male . Radio button2 text---->Female.

Jacob said...

Sir, Could you please tell how a user can logout after signin?

Shekhar Shete MCTS said...

How to get other details such as Companyname, phone, city, email? and how to logout from LinkedIn after logged in?

Help appreciated ! Thanks :)
www.shekharshetemcts.wordpress.com

Joeri said...

I tried many things to auto-login the user after he granted access to the app, even this script,, but in every code scenario, when I refresh the page, i get the login-button (and if if check the IN login status, it returns false )

karthick said...

thanks.how to post using javascript

Unknown said...

thanks..........but how to login with google+....

shubu said...

hello sir this shoaib actually i get one project ,I need pull the profile data from linkedin and store the database and display in Grid view

Anonymous said...

Hi can I put My own button instead of this linkedin button. Onclick of that button popup should come.

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.