{"id":20218,"date":"2014-09-12T08:51:56","date_gmt":"2014-09-12T14:21:56","guid":{"rendered":"https:\/\/www.solutionanalysts.com\/blog\/login-with-facebook-api-v2\/"},"modified":"2023-08-16T23:14:27","modified_gmt":"2023-08-17T04:44:27","slug":"login-with-facebook-api-v2","status":"publish","type":"post","link":"https:\/\/www.solutionanalysts.com\/blog\/login-with-facebook-api-v2\/","title":{"rendered":"Login with Facebook API V2"},"content":{"rendered":"<p>In this blog, we will explain how to implement login with facebook using Javascript SDK v2.1.<\/p>\n<p><script src=\"https:\/\/gist.github.com\/anonymous\/59b04de0349847d2084c.js\"><\/script><\/p>\n<div id=\"gist19589516\" class=\"gist\">\n<div class=\"gist-file\">\n<div class=\"gist-data\">\n<div class=\"js-gist-file-update-container js-task-list-container file-box\">\n<div id=\"file-login-with-facebook-api-v2\" class=\"file\">\n<div class=\"blob-wrapper data type-text\">\n<div class=\"table-responsive\"><table class=\"highlight tab-size js-file-line-container\" data-tab-size=\"8\">\n<tbody>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L1\" class=\"blob-num js-line-number\" data-line-number=\"1\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC1\" class=\"blob-code blob-code-inner js-file-line\">window.fbAsyncInit = function() {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L2\" class=\"blob-num js-line-number\" data-line-number=\"2\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC2\" class=\"blob-code blob-code-inner js-file-line\">FB.init({<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L3\" class=\"blob-num js-line-number\" data-line-number=\"3\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC3\" class=\"blob-code blob-code-inner js-file-line\">appId : &#8216;YOUR_APP_ID&#8217;,<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L4\" class=\"blob-num js-line-number\" data-line-number=\"4\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC4\" class=\"blob-code blob-code-inner js-file-line\">cookie : true, \/\/ enable cookies to allow the server to access<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L5\" class=\"blob-num js-line-number\" data-line-number=\"5\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC5\" class=\"blob-code blob-code-inner js-file-line\">\/\/ the session<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L6\" class=\"blob-num js-line-number\" data-line-number=\"6\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC6\" class=\"blob-code blob-code-inner js-file-line\">xfbml : true, \/\/ parse social plugins on this page<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L7\" class=\"blob-num js-line-number\" data-line-number=\"7\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC7\" class=\"blob-code blob-code-inner js-file-line\">version : &#8216;v2.1&#8217; \/\/ use version 2.1<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L8\" class=\"blob-num js-line-number\" data-line-number=\"8\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC8\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L9\" class=\"blob-num js-line-number\" data-line-number=\"9\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC9\" class=\"blob-code blob-code-inner js-file-line\">};<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L10\" class=\"blob-num js-line-number\" data-line-number=\"10\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC10\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L11\" class=\"blob-num js-line-number\" data-line-number=\"11\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC11\" class=\"blob-code blob-code-inner js-file-line\">(function(d, s, id) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L12\" class=\"blob-num js-line-number\" data-line-number=\"12\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC12\" class=\"blob-code blob-code-inner js-file-line\">var js, fjs = d.getElementsByTagName(s)[0];<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L13\" class=\"blob-num js-line-number\" data-line-number=\"13\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC13\" class=\"blob-code blob-code-inner js-file-line\">if (d.getElementById(id)) return;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L14\" class=\"blob-num js-line-number\" data-line-number=\"14\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC14\" class=\"blob-code blob-code-inner js-file-line\">js = d.createElement(s); js.id = id;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L15\" class=\"blob-num js-line-number\" data-line-number=\"15\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC15\" class=\"blob-code blob-code-inner js-file-line\">js.src = &#8220;\/\/connect.facebook.net\/en_US\/sdk.js&#8221;;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L16\" class=\"blob-num js-line-number\" data-line-number=\"16\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC16\" class=\"blob-code blob-code-inner js-file-line\">fjs.parentNode.insertBefore(js, fjs);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L17\" class=\"blob-num js-line-number\" data-line-number=\"17\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC17\" class=\"blob-code blob-code-inner js-file-line\">}(document, &#8216;script&#8217;, &#8216;facebook-jssdk&#8217;));<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"gist-meta\"><a style=\"float: right;\" href=\"https:\/\/gist.github.com\/anonymous\/59b04de0349847d2084c\/raw\/177e6716193a1032d177280b644bc657a8434774\/Login%20with%20Facebook%20API%20V2\" target=\"_blank\" rel=\"noopener\">view raw<\/a><br \/>\n<a href=\"https:\/\/gist.github.com\/anonymous\/59b04de0349847d2084c#file-login-with-facebook-api-v2\" target=\"_blank\" rel=\"noopener\">Login with Facebook API V2<\/a><br \/>\nhosted with \u2764 by <a href=\"https:\/\/github.com\" target=\"_blank\" rel=\"noopener\">GitHub<\/a><\/div>\n<\/div>\n<\/div>\n<p>By help of above code, we can load sdk and initialize required parameters.<\/p>\n<p>We have created a function which will call facebook login API, fetch response and allows developer to write code to handle different success\/failure cases.<\/p>\n<p><script src=\"https:\/\/gist.github.com\/anonymous\/4e38b6705a5d952a6b82.js\"><\/script><\/p>\n<div id=\"gist19589510\" class=\"gist\">\n<div class=\"gist-file\">\n<div class=\"gist-data\">\n<div class=\"js-gist-file-update-container js-task-list-container file-box\">\n<div id=\"file-login-with-facebook-api-v2\" class=\"file\">\n<div class=\"blob-wrapper data type-text\">\n<div class=\"table-responsive\"><table class=\"highlight tab-size js-file-line-container\" data-tab-size=\"8\">\n<tbody>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L1\" class=\"blob-num js-line-number\" data-line-number=\"1\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC1\" class=\"blob-code blob-code-inner js-file-line\">function fb_login(){<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L2\" class=\"blob-num js-line-number\" data-line-number=\"2\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC2\" class=\"blob-code blob-code-inner js-file-line\">FB.login(function(response) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L3\" class=\"blob-num js-line-number\" data-line-number=\"3\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC3\" class=\"blob-code blob-code-inner js-file-line\">if (response.authResponse) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L4\" class=\"blob-num js-line-number\" data-line-number=\"4\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC4\" class=\"blob-code blob-code-inner js-file-line\">console.log(&#8216;Welcome! Fetching your information&#8230;. &#8216;);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L5\" class=\"blob-num js-line-number\" data-line-number=\"5\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC5\" class=\"blob-code blob-code-inner js-file-line\">\/\/console.log(response); \/\/ dump complete info<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L6\" class=\"blob-num js-line-number\" data-line-number=\"6\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC6\" class=\"blob-code blob-code-inner js-file-line\">access_token = response.authResponse.accessToken; \/\/get access token<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L7\" class=\"blob-num js-line-number\" data-line-number=\"7\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC7\" class=\"blob-code blob-code-inner js-file-line\">user_id = response.authResponse.userID; \/\/get FB UID<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L8\" class=\"blob-num js-line-number\" data-line-number=\"8\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC8\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L9\" class=\"blob-num js-line-number\" data-line-number=\"9\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC9\" class=\"blob-code blob-code-inner js-file-line\">FB.api(&#8216;\/me?fields=id,name,friendlists&#8217;, function(response) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L10\" class=\"blob-num js-line-number\" data-line-number=\"10\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC10\" class=\"blob-code blob-code-inner js-file-line\">user_email = response.email; \/\/get user email<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L11\" class=\"blob-num js-line-number\" data-line-number=\"11\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC11\" class=\"blob-code blob-code-inner js-file-line\">console.log(response);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L12\" class=\"blob-num js-line-number\" data-line-number=\"12\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC12\" class=\"blob-code blob-code-inner js-file-line\">alert(user_email);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L13\" class=\"blob-num js-line-number\" data-line-number=\"13\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC13\" class=\"blob-code blob-code-inner js-file-line\">\/\/ you can store this data into your database<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L14\" class=\"blob-num js-line-number\" data-line-number=\"14\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC14\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L15\" class=\"blob-num js-line-number\" data-line-number=\"15\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC15\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L16\" class=\"blob-num js-line-number\" data-line-number=\"16\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC16\" class=\"blob-code blob-code-inner js-file-line\">} else {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L17\" class=\"blob-num js-line-number\" data-line-number=\"17\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC17\" class=\"blob-code blob-code-inner js-file-line\">\/\/user hit cancel button<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L18\" class=\"blob-num js-line-number\" data-line-number=\"18\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC18\" class=\"blob-code blob-code-inner js-file-line\">console.log(&#8216;User cancelled login or did not fully authorize.&#8217;);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L19\" class=\"blob-num js-line-number\" data-line-number=\"19\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC19\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L20\" class=\"blob-num js-line-number\" data-line-number=\"20\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC20\" class=\"blob-code blob-code-inner js-file-line\">}<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L21\" class=\"blob-num js-line-number\" data-line-number=\"21\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC21\" class=\"blob-code blob-code-inner js-file-line\">}, {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L22\" class=\"blob-num js-line-number\" data-line-number=\"22\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC22\" class=\"blob-code blob-code-inner js-file-line\">scope: &#8216;publish_stream,email,read_friendlists&#8217;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L23\" class=\"blob-num js-line-number\" data-line-number=\"23\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC23\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L24\" class=\"blob-num js-line-number\" data-line-number=\"24\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC24\" class=\"blob-code blob-code-inner js-file-line\">}<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"gist-meta\"><a style=\"float: right;\" href=\"https:\/\/gist.github.com\/anonymous\/4e38b6705a5d952a6b82\/raw\/e3dce048f8d8e9e8e1e86d1ecb85268283ea8399\/Login%20with%20Facebook%20API%20V2\" target=\"_blank\" rel=\"noopener\">view raw<\/a><br \/>\n<a href=\"https:\/\/gist.github.com\/anonymous\/4e38b6705a5d952a6b82#file-login-with-facebook-api-v2\" target=\"_blank\" rel=\"noopener\">Login with Facebook API V2<\/a><br \/>\nhosted with \u2764 by <a href=\"https:\/\/github.com\" target=\"_blank\" rel=\"noopener\">GitHub<\/a><\/div>\n<\/div>\n<\/div>\n<p>In the above example, we have passed a scope parameter, by which Facebook will identify and ask all required permissions to user.<\/p>\n<p>Facebook by default gives access to email, public_profile and user_friends permission. If the developer wants to get other information, he has to get them reviewed from Facebook for the app using the App settings tab. Unless it is reviewed and approved by Facbook, this parameter will not work as expected.<\/p>\n<p>In FB.api, we have passed query parameters. FB will only return these many values in response if passed.<\/p>\n<p>Facebook has announced stable support for at least 2 years for API v2.<\/p>\n<p>Below is the full working code.<br \/>\n<script src=\"https:\/\/gist.github.com\/anonymous\/9c183ff710702be5d8fc.js\"><\/script><\/p>\n<div id=\"gist19589500\" class=\"gist\">\n<div class=\"gist-file\">\n<div class=\"gist-data\">\n<div class=\"js-gist-file-update-container js-task-list-container file-box\">\n<div id=\"file-login-with-facebook-api-v2\" class=\"file\">\n<div class=\"blob-wrapper data type-text\">\n<div class=\"table-responsive\"><table class=\"highlight tab-size js-file-line-container\" data-tab-size=\"8\">\n<tbody>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L1\" class=\"blob-num js-line-number\" data-line-number=\"1\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC1\" class=\"blob-code blob-code-inner js-file-line\">&lt;title&gt;Facebook Login JavaScript Example&lt;\/title&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L2\" class=\"blob-num js-line-number\" data-line-number=\"2\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC2\" class=\"blob-code blob-code-inner js-file-line\">&lt;meta charset=&#8221;UTF-8&#8243;&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L3\" class=\"blob-num js-line-number\" data-line-number=\"3\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC3\" class=\"blob-code blob-code-inner js-file-line\">&lt;script&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L4\" class=\"blob-num js-line-number\" data-line-number=\"4\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC4\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L5\" class=\"blob-num js-line-number\" data-line-number=\"5\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC5\" class=\"blob-code blob-code-inner js-file-line\">window.fbAsyncInit = function() {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L6\" class=\"blob-num js-line-number\" data-line-number=\"6\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC6\" class=\"blob-code blob-code-inner js-file-line\">FB.init({<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L7\" class=\"blob-num js-line-number\" data-line-number=\"7\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC7\" class=\"blob-code blob-code-inner js-file-line\">appId : &#8216;572516629527309&#8217;,<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L8\" class=\"blob-num js-line-number\" data-line-number=\"8\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC8\" class=\"blob-code blob-code-inner js-file-line\">cookie : true, \/\/ enable cookies to allow the server to access<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L9\" class=\"blob-num js-line-number\" data-line-number=\"9\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC9\" class=\"blob-code blob-code-inner js-file-line\">\/\/ the session<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L10\" class=\"blob-num js-line-number\" data-line-number=\"10\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC10\" class=\"blob-code blob-code-inner js-file-line\">xfbml : true, \/\/ parse social plugins on this page<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L11\" class=\"blob-num js-line-number\" data-line-number=\"11\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC11\" class=\"blob-code blob-code-inner js-file-line\">version : &#8216;v2.1&#8217; \/\/ use version 2.1<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L12\" class=\"blob-num js-line-number\" data-line-number=\"12\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC12\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L13\" class=\"blob-num js-line-number\" data-line-number=\"13\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC13\" class=\"blob-code blob-code-inner js-file-line\">};<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L14\" class=\"blob-num js-line-number\" data-line-number=\"14\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC14\" class=\"blob-code blob-code-inner js-file-line\">(function(d, s, id) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L15\" class=\"blob-num js-line-number\" data-line-number=\"15\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC15\" class=\"blob-code blob-code-inner js-file-line\">var js, fjs = d.getElementsByTagName(s)[0];<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L16\" class=\"blob-num js-line-number\" data-line-number=\"16\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC16\" class=\"blob-code blob-code-inner js-file-line\">if (d.getElementById(id)) return;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L17\" class=\"blob-num js-line-number\" data-line-number=\"17\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC17\" class=\"blob-code blob-code-inner js-file-line\">js = d.createElement(s); js.id = id;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L18\" class=\"blob-num js-line-number\" data-line-number=\"18\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC18\" class=\"blob-code blob-code-inner js-file-line\">js.src = &#8220;\/\/connect.facebook.net\/en_US\/sdk.js&#8221;;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L19\" class=\"blob-num js-line-number\" data-line-number=\"19\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC19\" class=\"blob-code blob-code-inner js-file-line\">fjs.parentNode.insertBefore(js, fjs);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L20\" class=\"blob-num js-line-number\" data-line-number=\"20\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC20\" class=\"blob-code blob-code-inner js-file-line\">}(document, &#8216;script&#8217;, &#8216;facebook-jssdk&#8217;));<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L21\" class=\"blob-num js-line-number\" data-line-number=\"21\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC21\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L22\" class=\"blob-num js-line-number\" data-line-number=\"22\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC22\" class=\"blob-code blob-code-inner js-file-line\">function fb_login(){<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L23\" class=\"blob-num js-line-number\" data-line-number=\"23\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC23\" class=\"blob-code blob-code-inner js-file-line\">FB.login(function(response) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L24\" class=\"blob-num js-line-number\" data-line-number=\"24\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC24\" class=\"blob-code blob-code-inner js-file-line\">if (response.authResponse) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L25\" class=\"blob-num js-line-number\" data-line-number=\"25\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC25\" class=\"blob-code blob-code-inner js-file-line\">console.log(&#8216;Welcome! Fetching your information&#8230;. &#8216;);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L26\" class=\"blob-num js-line-number\" data-line-number=\"26\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC26\" class=\"blob-code blob-code-inner js-file-line\">\/\/console.log(response); \/\/ dump complete info<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L27\" class=\"blob-num js-line-number\" data-line-number=\"27\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC27\" class=\"blob-code blob-code-inner js-file-line\">access_token = response.authResponse.accessToken; \/\/get access token<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L28\" class=\"blob-num js-line-number\" data-line-number=\"28\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC28\" class=\"blob-code blob-code-inner js-file-line\">user_id = response.authResponse.userID; \/\/get FB UID<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L29\" class=\"blob-num js-line-number\" data-line-number=\"29\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC29\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L30\" class=\"blob-num js-line-number\" data-line-number=\"30\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC30\" class=\"blob-code blob-code-inner js-file-line\">FB.api(&#8216;\/me?fields=id,name,friendlists&#8217;, function(response) {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L31\" class=\"blob-num js-line-number\" data-line-number=\"31\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC31\" class=\"blob-code blob-code-inner js-file-line\">user_email = response.email; \/\/get user email<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L32\" class=\"blob-num js-line-number\" data-line-number=\"32\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC32\" class=\"blob-code blob-code-inner js-file-line\">console.log(response);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L33\" class=\"blob-num js-line-number\" data-line-number=\"33\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC33\" class=\"blob-code blob-code-inner js-file-line\">alert(user_email);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L34\" class=\"blob-num js-line-number\" data-line-number=\"34\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC34\" class=\"blob-code blob-code-inner js-file-line\">\/\/ you can store this data into your database<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L35\" class=\"blob-num js-line-number\" data-line-number=\"35\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC35\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L36\" class=\"blob-num js-line-number\" data-line-number=\"36\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC36\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L37\" class=\"blob-num js-line-number\" data-line-number=\"37\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC37\" class=\"blob-code blob-code-inner js-file-line\">} else {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L38\" class=\"blob-num js-line-number\" data-line-number=\"38\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC38\" class=\"blob-code blob-code-inner js-file-line\">\/\/user hit cancel button<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L39\" class=\"blob-num js-line-number\" data-line-number=\"39\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC39\" class=\"blob-code blob-code-inner js-file-line\">console.log(&#8216;User cancelled login or did not fully authorize.&#8217;);<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L40\" class=\"blob-num js-line-number\" data-line-number=\"40\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC40\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L41\" class=\"blob-num js-line-number\" data-line-number=\"41\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC41\" class=\"blob-code blob-code-inner js-file-line\">}<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L42\" class=\"blob-num js-line-number\" data-line-number=\"42\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC42\" class=\"blob-code blob-code-inner js-file-line\">}, {<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L43\" class=\"blob-num js-line-number\" data-line-number=\"43\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC43\" class=\"blob-code blob-code-inner js-file-line\">scope: &#8216;publish_stream,email,read_friendlists&#8217;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L44\" class=\"blob-num js-line-number\" data-line-number=\"44\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC44\" class=\"blob-code blob-code-inner js-file-line\">});<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L45\" class=\"blob-num js-line-number\" data-line-number=\"45\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC45\" class=\"blob-code blob-code-inner js-file-line\">}<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L46\" class=\"blob-num js-line-number\" data-line-number=\"46\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC46\" class=\"blob-code blob-code-inner js-file-line\">&lt;\/script&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L47\" class=\"blob-num js-line-number\" data-line-number=\"47\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC47\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L48\" class=\"blob-num js-line-number\" data-line-number=\"48\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC48\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L49\" class=\"blob-num js-line-number\" data-line-number=\"49\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC49\" class=\"blob-code blob-code-inner js-file-line\"><\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L50\" class=\"blob-num js-line-number\" data-line-number=\"50\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC50\" class=\"blob-code blob-code-inner js-file-line\">&lt;a href=&#8221;#&#8221; onclick=&#8221;return fb_login();&#8221;&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L51\" class=\"blob-num js-line-number\" data-line-number=\"51\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC51\" class=\"blob-code blob-code-inner js-file-line\">&lt;img src=&#8221;http:\/\/www.myclientpage.com\/images\/fb_login.gif&#8221;&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L52\" class=\"blob-num js-line-number\" data-line-number=\"52\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC52\" class=\"blob-code blob-code-inner js-file-line\">&lt;\/a&gt;<\/td>\n<\/tr>\n<tr>\n<td id=\"file-login-with-facebook-api-v2-L53\" class=\"blob-num js-line-number\" data-line-number=\"53\"><\/td>\n<td id=\"file-login-with-facebook-api-v2-LC53\" class=\"blob-code blob-code-inner js-file-line\">&lt;div id=&#8221;status&#8221;&gt;&lt;\/div&gt;<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"gist-meta\"><a style=\"float: right;\" href=\"https:\/\/gist.github.com\/anonymous\/9c183ff710702be5d8fc\/raw\/e6598f67cf605fd70a3738f22b6d868a39a03816\/Login%20with%20Facebook%20API%20V2\" target=\"_blank\" rel=\"noopener\">view raw<\/a><br \/>\n<a href=\"https:\/\/gist.github.com\/anonymous\/9c183ff710702be5d8fc#file-login-with-facebook-api-v2\" target=\"_blank\" rel=\"noopener\">Login with Facebook API V2<\/a><br \/>\nhosted with \u2764 by <a href=\"https:\/\/github.com\" target=\"_blank\" rel=\"noopener\">GitHub<\/a><\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this blog, we will explain how to implement login with facebook using Javascript SDK v2.1. window.fbAsyncInit = function() { FB.init({ appId : &#8216;YOUR_APP_ID&#8217;, cookie : true, \/\/ enable cookies to allow the server to access \/\/ the session xfbml : true, \/\/ parse social plugins on this page version : &#8216;v2.1&#8217; \/\/ use version [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":20219,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-20218","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-hire-developer"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/posts\/20218","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/comments?post=20218"}],"version-history":[{"count":1,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/posts\/20218\/revisions"}],"predecessor-version":[{"id":32648,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/posts\/20218\/revisions\/32648"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/media\/20219"}],"wp:attachment":[{"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/media?parent=20218"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/categories?post=20218"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.solutionanalysts.com\/blog\/wp-json\/wp\/v2\/tags?post=20218"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}