Created
April 8, 2020 18:22
-
-
Save fhdalikhan/85dc4a18ca91af35d1d35ac4cc380e5e to your computer and use it in GitHub Desktop.
Facebook login via js
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title> Website - Welcome | |
| </title> | |
| </head> | |
| <body> | |
| <script> | |
| window.fbAsyncInit = function() { | |
| FB.init({ | |
| appId : 'your-app-id', | |
| cookie : true, | |
| xfbml : true, | |
| version : 'v6.0' // your app version | |
| }); | |
| FB.AppEvents.logPageView(); | |
| FB.getLoginStatus(function(response) { | |
| statusChangeCallback(response); | |
| }); | |
| }; | |
| (function(d, s, id){ | |
| var js, fjs = d.getElementsByTagName(s)[0]; | |
| if (d.getElementById(id)) {return;} | |
| js = d.createElement(s); js.id = id; | |
| js.src = "https://connect.facebook.net/en_US/sdk.js"; | |
| fjs.parentNode.insertBefore(js, fjs); | |
| }(document, 'script', 'facebook-jssdk')); | |
| function statusChangeCallback(argument) { | |
| console.log(argument); | |
| var logoutButton = document.getElementById('logout'); | |
| if (argument.status === 'connected') { | |
| // is login, show logout button | |
| logoutButton.style.display = 'block' | |
| testAPI(); | |
| } else { | |
| // not login, show login button | |
| logoutButton.style.display = 'none' | |
| document.getElementById('status').innerHTML = 'Please log ' + | |
| 'into this webpage.'; | |
| } | |
| } | |
| function checkLoginState() { | |
| FB.getLoginStatus(function(response) { | |
| statusChangeCallback(response); | |
| }); | |
| } | |
| function logout() { | |
| FB.logout(function(response) { | |
| // Person is now logged out | |
| console.log(response) | |
| var logoutButton = document.getElementById('logout'); | |
| logoutButton.style.display = 'none'; | |
| document.getElementById('status').innerHTML = 'Please log ' + | |
| 'into this webpage.'; | |
| }); | |
| } | |
| function testAPI() {// Testing Graph API after login. See statusChangeCallback() for when this call is made. | |
| console.log('Welcome! Fetching your information.... '); | |
| FB.api('/me', function(response) { | |
| console.log('Successful login for: ' + response.name); | |
| document.getElementById('status').innerHTML = | |
| 'Thanks for logging in, ' + response.name + '!'; | |
| }); | |
| } | |
| </script> | |
| <fb:login-button id="login" | |
| scope="public_profile,email" | |
| onlogin="checkLoginState();"> | |
| </fb:login-button> | |
| <a href="javascript:;" id="logout" onclick="logout();" style="display: none;">Logout</a> | |
| <div id="status"> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment