Skip to content

Instantly share code, notes, and snippets.

@achraf-jeday

achraf-jeday/Login.html

Last active September 9, 2019 14:34
Show Gist options
  • Save achraf-jeday/223773adae12965c6240ab5ac449f5fb to your computer and use it in GitHub Desktop.
Save achraf-jeday/223773adae12965c6240ab5ac449f5fb to your computer and use it in GitHub Desktop.
Download ZIP
Javascript Linkedin Social Login Button for OAuth.io https://oauth.io/, https://www.linkedin.com/developers/
Raw
Login.html
<html>
<header>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdn.rawgit.com/oauth-io/oauth-js/c5af4519/dist/oauth.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-social/4.12.0/bootstrap-social.min.css">
</header>
<body>
<a id="linkedin-button" class="btn btn-block btn-social btn-linkedin">
<i class="fa fa-linkedin"></i> Sign in with Linkedin
</a>
<script>
$('#linkedin-button').on('click', function() {
// Initialize with your OAuth.io app public key
OAuth.initialize('YOUR_OAUTH_KEY');
// Use popup for oauth
OAuth.popup('linkedin2').then(linkedin => {
console.log('linkedin:',linkedin);
// Prompts 'welcome' message with User's email on successful login
// #me() is a convenient method to retrieve user data without requiring you
// to know which OAuth provider url to call
linkedin.me().then(data => {
console.log('me data:', data);
alert('Linkedin says your email is:' + data.email + ".\nView browser 'Console Log' for more details");
})
// Retrieves user data from OAuth provider by using #get() and
// OAuth provider url
linkedin.get('/v2/me').then(data => {
console.log('self data:', data);
})
});
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment