{"id":3287,"date":"2018-05-28T19:10:54","date_gmt":"2018-05-28T19:10:54","guid":{"rendered":"https:\/\/www.codexworld.com\/?p=3287"},"modified":"2018-05-28T19:15:06","modified_gmt":"2018-05-28T19:15:06","slug":"codeigniter-facebook-login-javascript-sdk","status":"publish","type":"post","link":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/","title":{"rendered":"Login with Facebook in CodeIgniter using JavaScript SDK"},"content":{"rendered":"<p><b>Facebook JavaScript SDK<\/b> provides the easiest way to implement login system with Facebook on the website. Using JavaScript SDK, you can allow the user to sign into the web application with their Facebook account. The user can log in to your web application using their existing Facebook account without registration on your website.<\/p>\n<p>Various SDK and API are available to integrate Facebook login on the website. But Facebook JavaScript SDK is the most user-friendly way to integrate Facebook login in the web application. It allows you to implement login with Facebook without page refresh using JavaScript SDK. In this tutorial, we will show you how to integrate <b>login with Facebook in CodeIgniter using JavaScript SDK<\/b> and Graph API.<\/p>\n<p>The following functionalities will be implemented to implement Facebook Login in CodeIgniter.<\/p>\n<ul class=\"bullet_disk_list\">\n<li>Authenticate the user with the Facebook account using JavaScript SDK.<\/li>\n<li>Retrieve user&#8217;s profile information using Graph API.<\/li>\n<li>Store the user&#8217;s profile data in the MySQL database.<\/li>\n<\/ul>\n<h2>Facebook Apps Creation<\/h2>\n<p>To access Facebook JavaScript SDK you need to create a Facebook App and specify the App ID on your API call. To generate App ID on Facebook Developer account, go through this step-by-step guide &#8211; <a href=\"https:\/\/www.codexworld.com\/create-facebook-app-id-app-secret\/\">How to Create Facebook App, App ID, and App Secret<\/a><\/p>\n<p>After creating the Facebook App, copy the <b>App ID<\/b> and put it into the respective option of the <code>init()<\/code> function in JavaScript code.<\/p>\n<h2>Create Database Table<\/h2>\n<p>To store the user&#8217;s Facebook profile data, a table needs to be created in the database. The following SQL creates a <code>users<\/code> table with some basic fields in the MySQL database.<\/p>\n<pre><span style=\"color:#794938\">CREATE<\/span> <span style=\"color:#794938\">TABLE<\/span> `<span style=\"color:#bf4f24\">users<\/span>` (\r\n <span style=\"color:#0b6125\">`id`<\/span> <span style=\"color:#a71d5d;font-style:italic\">int<\/span>(<span style=\"color:#811f24;font-weight:700\">11<\/span>) <span style=\"color:#794938\">NOT NULL<\/span> AUTO_INCREMENT,\r\n <span style=\"color:#0b6125\">`oauth_provider`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">50<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`oauth_uid`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">100<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`first_name`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">50<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`last_name`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">50<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`email`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">100<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`gender`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">10<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`locale`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">10<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`cover`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">255<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`picture`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">255<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`link`<\/span> <span style=\"color:#a71d5d;font-style:italic\">varchar<\/span>(<span style=\"color:#811f24;font-weight:700\">255<\/span>) COLLATE utf8_unicode_ci <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`created`<\/span> datetime <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#0b6125\">`modified`<\/span> datetime <span style=\"color:#794938\">NOT NULL<\/span>,\r\n <span style=\"color:#a71d5d;font-style:italic\">PRIMARY KEY<\/span> (<span style=\"color:#0b6125\">`id`<\/span>)\r\n) ENGINE<span style=\"color:#794938\">=<\/span>InnoDB DEFAULT CHARSET<span style=\"color:#794938\">=<\/span>utf8 COLLATE<span style=\"color:#794938\">=<\/span>utf8_unicode_ci;\r\n<\/pre>\n<p class=\"seeAlso\"><span><\/span><a href=\"https:\/\/www.codexworld.com\/login-with-facebook-using-javascript-sdk\/\">Login with Facebook using JavaScript SDK<\/a><\/span><\/p>\n<h2>Controller (Facebook_login.php)<\/h2>\n<p>The Facebook_Login controller contains 3 functions, __construct(), index(), and saveUserData().<\/p>\n<ul class=\"bullet_disk_list\">\n<li><code>__construct()<\/code> \u2013 Loads the User model.<\/li>\n<li><code>index()<\/code> \u2013 Load the login and profile view.<\/li>\n<li><code>saveUserData()<\/code> &#8211; This method is called by the Ajax to insert the user data in the database.\n<ul>\n<li>Decode the posted JSON data and get user profile data.<\/li>\n<li>Insert or update user data in the database using the User model.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php&nbsp;defined<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'BASEPATH'<\/span><span style=\"color: #007700\">)&nbsp;OR&nbsp;exit(<\/span><span style=\"color: #DD0000\">'No&nbsp;direct&nbsp;script&nbsp;access&nbsp;allowed'<\/span><span style=\"color: #007700\">);<br \/><br \/>class&nbsp;<\/span><span style=\"color: #0000BB\">Facebook_Login&nbsp;<\/span><span style=\"color: #007700\">extends&nbsp;<\/span><span style=\"color: #0000BB\">CI_Controller&nbsp;<\/span><span style=\"color: #007700\">{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">__construct<\/span><span style=\"color: #007700\">()&nbsp;{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">parent<\/span><span style=\"color: #007700\">::<\/span><span style=\"color: #0000BB\">__construct<\/span><span style=\"color: #007700\">();<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Load&nbsp;user&nbsp;model<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">load<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">model<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'user'<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">index<\/span><span style=\"color: #007700\">(){<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Load&nbsp;login&nbsp;&amp;&nbsp;profile&nbsp;view<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">load<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">view<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'facebook_login\/index'<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;}<br \/><br \/>&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">saveUserData<\/span><span style=\"color: #007700\">()&nbsp;{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Decode&nbsp;json&nbsp;data&nbsp;and&nbsp;get&nbsp;user&nbsp;profile&nbsp;data<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$postData&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">json_decode<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'userData'<\/span><span style=\"color: #007700\">]);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Preparing&nbsp;data&nbsp;for&nbsp;database&nbsp;insertion<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'oauth_provider'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$_POST<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'oauth_provider'<\/span><span style=\"color: #007700\">];<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'oauth_uid'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">id<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'first_name'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">first_name<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'last_name'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">last_name<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'email'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">email<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'gender'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">gender<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'locale'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">locale<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'cover'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">cover<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">source<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'picture'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">picture<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">data<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">url<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'link'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">$postData<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">link<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/&nbsp;Insert&nbsp;or&nbsp;update&nbsp;user&nbsp;data<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userID&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">user<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">checkUser<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;<\/span><span style=\"color: #0000BB\">true<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>}<\/span><\/pre>\n<h2>Model (User.php)<\/h2>\n<p>The User model contains 2 functions, __construct() and checkUser().<\/p>\n<ul class=\"bullet_disk_list\">\n<li><code>__construct()<\/code> &#8211; Define table name and primary key of this table.<\/li>\n<li><code>checkUser()<\/code> &#8211; Insert or update the user profile information in the users table.<\/li>\n<ul>\n<li>If data exist with same oauth_provider and oauth_uid, existing record is updated. Otherwise, the user data is inserted in the users table.<\/li>\n<li>Based on the insertion, the respective user ID is returned.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<pre><span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">if&nbsp;(&nbsp;!&nbsp;<\/span><span style=\"color: #0000BB\">defined<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'BASEPATH'<\/span><span style=\"color: #007700\">))&nbsp;exit(<\/span><span style=\"color: #DD0000\">'No&nbsp;direct&nbsp;script&nbsp;access&nbsp;allowed'<\/span><span style=\"color: #007700\">);<br \/>class&nbsp;<\/span><span style=\"color: #0000BB\">User&nbsp;<\/span><span style=\"color: #007700\">extends&nbsp;<\/span><span style=\"color: #0000BB\">CI_Model<\/span><span style=\"color: #007700\">{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">__construct<\/span><span style=\"color: #007700\">()&nbsp;{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">tableName&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">'users'<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">primaryKey&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/*<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;*&nbsp;Insert&nbsp;\/&nbsp;Update&nbsp;facebook&nbsp;profile&nbsp;data&nbsp;into&nbsp;the&nbsp;database<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;*&nbsp;@param&nbsp;array&nbsp;the&nbsp;data&nbsp;for&nbsp;inserting&nbsp;into&nbsp;the&nbsp;table<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;*\/<br \/>&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">public&nbsp;function&nbsp;<\/span><span style=\"color: #0000BB\">checkUser<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$userData&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;array()){<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(!empty(<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">)){<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/check&nbsp;whether&nbsp;user&nbsp;data&nbsp;already&nbsp;exists&nbsp;in&nbsp;database&nbsp;with&nbsp;same&nbsp;oauth&nbsp;info<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">select<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">primaryKey<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">from<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">tableName<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">where<\/span><span style=\"color: #007700\">(array(<\/span><span style=\"color: #DD0000\">'oauth_provider'<\/span><span style=\"color: #007700\">=&gt;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'oauth_provider'<\/span><span style=\"color: #007700\">],&nbsp;<\/span><span style=\"color: #DD0000\">'oauth_uid'<\/span><span style=\"color: #007700\">=&gt;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'oauth_uid'<\/span><span style=\"color: #007700\">]));<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$prevQuery&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">get<\/span><span style=\"color: #007700\">();<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(<\/span><span style=\"color: #0000BB\">$prevQuery<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">num_rows<\/span><span style=\"color: #007700\">()&nbsp;&gt;&nbsp;<\/span><span style=\"color: #0000BB\">0<\/span><span style=\"color: #007700\">){<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$prevResult&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$prevQuery<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">row_array<\/span><span style=\"color: #007700\">();<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/update&nbsp;user&nbsp;data<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'modified'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">date<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">\"Y-m-d&nbsp;H:i:s\"<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$update&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">update<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">tableName<\/span><span style=\"color: #007700\">,&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">,&nbsp;array(<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">=&gt;<\/span><span style=\"color: #0000BB\">$prevResult<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">]));<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/get&nbsp;user&nbsp;ID<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userID&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$prevResult<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'id'<\/span><span style=\"color: #007700\">];<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}else{<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/insert&nbsp;user&nbsp;data<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'created'<\/span><span style=\"color: #007700\">]&nbsp;&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">date<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">\"Y-m-d&nbsp;H:i:s\"<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">[<\/span><span style=\"color: #DD0000\">'modified'<\/span><span style=\"color: #007700\">]&nbsp;=&nbsp;<\/span><span style=\"color: #0000BB\">date<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">\"Y-m-d&nbsp;H:i:s\"<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$insert&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">insert<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">tableName<\/span><span style=\"color: #007700\">,<\/span><span style=\"color: #0000BB\">$userData<\/span><span style=\"color: #007700\">);<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/get&nbsp;user&nbsp;ID<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #0000BB\">$userID&nbsp;<\/span><span style=\"color: #007700\">=&nbsp;<\/span><span style=\"color: #0000BB\">$this<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">db<\/span><span style=\"color: #007700\">-&gt;<\/span><span style=\"color: #0000BB\">insert_id<\/span><span style=\"color: #007700\">();<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #FF8000\">\/\/return&nbsp;user&nbsp;ID<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<\/span><span style=\"color: #007700\">return&nbsp;<\/span><span style=\"color: #0000BB\">$userID<\/span><span style=\"color: #007700\">?<\/span><span style=\"color: #0000BB\">$userID<\/span><span style=\"color: #007700\">:<\/span><span style=\"color: #0000BB\">FALSE<\/span><span style=\"color: #007700\">;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;}<br \/>}<\/span><\/pre>\n<h2>View (facebook_login\/index.php)<\/h2>\n<p>This view displays the Facebook Login button if the user not logged in with their Facebook account, otherwise, the user&#8217;s profile data will be shown.<\/p>\n<p><b>JavaScript Code:<\/b><br \/>\nThe jQuery Ajax is used to post user&#8217;s profile data to the Facebook_Login controller, so, include the jQuery library.<\/p>\n<pre>&lt;<span style=\"color:#bf4f24\">script<\/span> <span style=\"color:#bf4f24\">src<\/span>=<span style=\"color:#0b6125\">\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.2.1\/jquery.min.js\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">script<\/span>>\r\n<\/pre>\n<p>The following JavaScript handles the Facebook authentication process using Facebook JavaScript SDK and Graph API. You need to specify the Facebook App ID in <code>appId<\/code> option of FB.init() method.<\/p>\n<ul class=\"bullet_disk_list\">\n<li><code>fbLogin()<\/code> &#8211; Opens a login dialog to log in with Facebook account.<\/li>\n<li><code>getFbUserData()<\/code> &#8211; Retrieve the user profile data from Facebook and display profile details and login status to the user. This profile information is retrieved from Facebook &#8211; Account ID, First Name, Last Name, Email, Gender, Locale, Profile Picture, Cover Photo, and Profile Link.<\/li>\n<li><code>saveUserData()<\/code> &#8211; Post Facebook profile data to saveUserData method of the Facebook_Login controller via Ajax.<\/li>\n<li><code>fbLogout()<\/code> &#8211;  Logs the user out from the Facebook account.<\/li>\n<\/ul>\n<pre>&lt;<span style=\"color:#bf4f24\">script<\/span>>\r\n<span style=\"color:#691c97\">window<\/span>.<span style=\"color:#bf4f24\">fbAsyncInit<\/span> <span style=\"color:#794938\">=<\/span> <span style=\"color:#a71d5d;font-style:italic\">function<\/span>() {\r\n    <span style=\"color:#5a525f;font-style:italic\">\/\/ FB JavaScript SDK configuration and setup<\/span>\r\n    FB.init({\r\n      appId      : <span style=\"color:#0b6125\">'1609295222731026'<\/span>, <span style=\"color:#5a525f;font-style:italic\">\/\/ FB App ID<\/span>\r\n      cookie     : <span style=\"color:#811f24;font-weight:700\">true<\/span>,  <span style=\"color:#5a525f;font-style:italic\">\/\/ enable cookies to allow the server to access the session<\/span>\r\n      xfbml      : <span style=\"color:#811f24;font-weight:700\">true<\/span>,  <span style=\"color:#5a525f;font-style:italic\">\/\/ parse social plugins on this page<\/span>\r\n      version    : <span style=\"color:#0b6125\">'v2.10'<\/span> <span style=\"color:#5a525f;font-style:italic\">\/\/ use graph api version 2.10<\/span>\r\n    });\r\n    \r\n    <span style=\"color:#5a525f;font-style:italic\">\/\/ Check whether the user already logged in<\/span>\r\n    FB.getLoginStatus(<span style=\"color:#a71d5d;font-style:italic\">function<\/span>(response) {\r\n        <span style=\"color:#794938\">if<\/span> (response.<span style=\"color:#b4371f\">status<\/span> <span style=\"color:#794938\">===<\/span> <span style=\"color:#0b6125\">'connected'<\/span>) {\r\n            <span style=\"color:#5a525f;font-style:italic\">\/\/display user data<\/span>\r\n            getFbUserData();\r\n        }\r\n    });\r\n};\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">\/\/ Load the JavaScript SDK asynchronously<\/span>\r\n(<span style=\"color:#a71d5d;font-style:italic\">function<\/span>(d, s, id) {\r\n    <span style=\"color:#a71d5d;font-style:italic\">var<\/span> js, fjs <span style=\"color:#794938\">=<\/span> d.<span style=\"color:#693a17\">getElementsByTagName<\/span>(s)[<span style=\"color:#811f24;font-weight:700\">0<\/span>];\r\n    <span style=\"color:#794938\">if<\/span> (d.<span style=\"color:#693a17\">getElementById<\/span>(id)) <span style=\"color:#794938\">return<\/span>;\r\n    js <span style=\"color:#794938\">=<\/span> d.<span style=\"color:#693a17\">createElement<\/span>(s); js.<span style=\"color:#b4371f\">id<\/span> <span style=\"color:#794938\">=<\/span> id;\r\n    js.<span style=\"color:#b4371f\">src<\/span> <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">\"\/\/connect.facebook.net\/en_US\/sdk.js\"<\/span>;\r\n    fjs.<span style=\"color:#b4371f\">parentNode<\/span>.<span style=\"color:#693a17\">insertBefore<\/span>(js, fjs);\r\n}(<span style=\"color:#691c97\">document<\/span>, <span style=\"color:#0b6125\">'script'<\/span>, <span style=\"color:#0b6125\">'facebook-jssdk'<\/span>));\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">\/\/ Facebook login with JavaScript SDK<\/span>\r\n<span style=\"color:#a71d5d;font-style:italic\">function<\/span> <span style=\"color:#bf4f24\">fbLogin<\/span>() {\r\n    FB.login(<span style=\"color:#a71d5d;font-style:italic\">function<\/span> (response) {\r\n        <span style=\"color:#794938\">if<\/span> (response.authResponse) {\r\n            <span style=\"color:#5a525f;font-style:italic\">\/\/ Get and display the user profile data<\/span>\r\n            getFbUserData();\r\n        } <span style=\"color:#794938\">else<\/span> {\r\n            <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'status'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'User cancelled login or did not fully authorize.'<\/span>;\r\n        }\r\n    }, {scope: <span style=\"color:#0b6125\">'email'<\/span>});\r\n}\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">\/\/ Fetch the user profile data from facebook<\/span>\r\n<span style=\"color:#a71d5d;font-style:italic\">function<\/span> <span style=\"color:#bf4f24\">getFbUserData<\/span>(){\r\n    FB.api(<span style=\"color:#0b6125\">'\/me'<\/span>, {locale: <span style=\"color:#0b6125\">'en_US'<\/span>, fields: <span style=\"color:#0b6125\">'id,first_name,last_name,email,link,gender,locale,picture,cover'<\/span>},\r\n    <span style=\"color:#a71d5d;font-style:italic\">function<\/span> (response) {\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'fbLink'<\/span>).<span style=\"color:#693a17\">setAttribute<\/span>(<span style=\"color:#0b6125\">\"onclick\"<\/span>,<span style=\"color:#0b6125\">\"fbLogout()\"<\/span>);\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'fbLink'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'Logout from Facebook'<\/span>;\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'status'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'Thanks for logging in, '<\/span> <span style=\"color:#794938\">+<\/span> response.first_name <span style=\"color:#794938\">+<\/span> <span style=\"color:#0b6125\">'!'<\/span>;\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'userData'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'&lt;div style=\"position: relative;\">&lt;img src=\"'<\/span><span style=\"color:#794938\">+<\/span>response.cover.<span style=\"color:#b4371f\">source<\/span><span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'\" \/>&lt;img style=\"position: absolute; top: 90%; left: 25%;\" src=\"'<\/span><span style=\"color:#794938\">+<\/span>response.picture.<span style=\"color:#b4371f\">data<\/span>.url<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'\"\/>&lt;\/div>&lt;p>&lt;b>FB ID:&lt;\/b> '<\/span><span style=\"color:#794938\">+<\/span>response.<span style=\"color:#b4371f\">id<\/span><span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'&lt;\/p>&lt;p>&lt;b>Name:&lt;\/b> '<\/span><span style=\"color:#794938\">+<\/span>response.first_name<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">' '<\/span><span style=\"color:#794938\">+<\/span>response.last_name<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'&lt;\/p>&lt;p>&lt;b>Email:&lt;\/b> '<\/span><span style=\"color:#794938\">+<\/span>response.email<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'&lt;\/p>&lt;p>&lt;b>Gender:&lt;\/b> '<\/span><span style=\"color:#794938\">+<\/span>response.gender<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'&lt;\/p>&lt;p>&lt;b>Locale:&lt;\/b> '<\/span><span style=\"color:#794938\">+<\/span>response.locale<span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'&lt;\/p>&lt;p>&lt;b>Profile Link:&lt;\/b> &lt;a target=\"_blank\" href=\"'<\/span><span style=\"color:#794938\">+<\/span>response.<span style=\"color:#b4371f\">link<\/span><span style=\"color:#794938\">+<\/span><span style=\"color:#0b6125\">'\">click to view profile&lt;\/a>&lt;\/p>'<\/span>;\r\n        \r\n        <span style=\"color:#5a525f;font-style:italic\">\/\/ Save user data<\/span>\r\n        saveUserData(response);\r\n    });\r\n}\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">\/\/ Save user data to the database<\/span>\r\n<span style=\"color:#a71d5d;font-style:italic\">function<\/span> <span style=\"color:#bf4f24\">saveUserData<\/span>(userData){\r\n    <span style=\"color:#794938\">$<\/span><span style=\"color:#693a17\">.post<\/span>(<span style=\"color:#0b6125\">\"&lt;?php echo base_url('facebook_login\/saveUserData'); ?>\"<\/span>, {oauth_provider:<span style=\"color:#0b6125\">'facebook'<\/span>, userData: JSON.stringify(userData)}, <span style=\"color:#a71d5d;font-style:italic\">function<\/span>(data){ <span style=\"color:#794938\">return<\/span> <span style=\"color:#811f24;font-weight:700\">true<\/span>; });\r\n}\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">\/\/ Logout from facebook<\/span>\r\n<span style=\"color:#a71d5d;font-style:italic\">function<\/span> <span style=\"color:#bf4f24\">fbLogout<\/span>() {\r\n    FB.logout(<span style=\"color:#a71d5d;font-style:italic\">function<\/span>() {\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'fbLink'<\/span>).<span style=\"color:#693a17\">setAttribute<\/span>(<span style=\"color:#0b6125\">\"onclick\"<\/span>,<span style=\"color:#0b6125\">\"fbLogin()\"<\/span>);\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'fbLink'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'&lt;img src=\"&lt;?php echo base_url('<\/span>assets\/images\/fblogin.png<span style=\"color:#0b6125\">'); ?>\"\/>'<\/span>;\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'userData'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">''<\/span>;\r\n        <span style=\"color:#691c97\">document<\/span>.<span style=\"color:#693a17\">getElementById<\/span>(<span style=\"color:#0b6125\">'status'<\/span>).innerHTML <span style=\"color:#794938\">=<\/span> <span style=\"color:#0b6125\">'You have successfully logout from Facebook.'<\/span>;\r\n    });\r\n}\r\n&lt;\/<span style=\"color:#bf4f24\">script<\/span>>\r\n<\/pre>\n<p><b>HTML Code:<\/b><br \/>\nThe following HTML is used to display the Facebook Login button, user profile data, and login status.<\/p>\n<pre><span style=\"color:#5a525f;font-style:italic\">&lt;!-- Display login status --><\/span>\r\n&lt;<span style=\"color:#bf4f24\">div<\/span> <span style=\"color:#bf4f24\">id<\/span><span style=\"color:#794938\">=<\/span><span style=\"color:#0b6125\">\"status\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">div<\/span>>\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">&lt;!-- Facebook login or logout button --><\/span>\r\n&lt;<span style=\"color:#bf4f24\">a<\/span> <span style=\"color:#bf4f24\">href<\/span>=<span style=\"color:#0b6125\">\"javascript:void(0);\"<\/span> <span style=\"color:#bf4f24\">onclick<\/span>=<span style=\"color:#0b6125\">\"fbLogin();\"<\/span> <span style=\"color:#bf4f24\">id<\/span><span style=\"color:#794938\">=<\/span><span style=\"color:#0b6125\">\"fbLink\"<\/span>>&lt;<span style=\"color:#bf4f24\">img<\/span> <span style=\"color:#bf4f24\">src<\/span>=<span style=\"color:#0b6125\">\"<span style=\"color: #0000BB\">&lt;?php&nbsp;<\/span><span style=\"color: #007700\">echo&nbsp;<\/span><span style=\"color: #0000BB\">base_url<\/span><span style=\"color: #007700\">(<\/span><span style=\"color: #DD0000\">'assets\/images\/fblogin.png'<\/span><span style=\"color: #007700\">);&nbsp;<\/span><span style=\"color: #0000BB\">?&gt;<\/span>\"<\/span>\/>&lt;\/<span style=\"color:#bf4f24\">a<\/span>>\r\n\r\n<span style=\"color:#5a525f;font-style:italic\">&lt;!-- Display user profile data --><\/span>\r\n&lt;<span style=\"color:#bf4f24\">div<\/span> <span style=\"color:#bf4f24\">id<\/span><span style=\"color:#794938\">=<\/span><span style=\"color:#0b6125\">\"userData\"<\/span>>&lt;\/<span style=\"color:#bf4f24\">div<\/span>>\r\n<\/pre>\n<p class=\"seeAlso\"><span><\/span><a href=\"https:\/\/www.codexworld.com\/login-with-facebook-using-php\/\">Login with Facebook using PHP<\/a><\/span><\/p>\n<h2>Conclusion<\/h2>\n<p>Our example code makes the Facebook Login integration easier for CodeIgniter web application. It helps to implement Facebook Login in CodeIgniter without page refresh using JavaScript SDK. Only some minimal settings are needed to integrate login system with Facebook on your CodeIgniter application. Alternatively, you can use <a href=\"https:\/\/www.codexworld.com\/facebook-login-codeigniter\/\">PHP SDK v5 for CodeIgniter<\/a> to integrate Facebook login in CodeIgniter.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Facebook JavaScript SDK provides the easiest way to implement login system with Facebook on the website. Using JavaScript SDK, you can allow the user to sign into the web application with their Facebook account. The <\/p>\n","protected":false},"author":1,"featured_media":3289,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[8],"tags":[55,44,83,66,84,273],"class_list":["post-3287","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codeigniter","tag-codeigniter","tag-facebook","tag-facebookapi","tag-javascript","tag-login","tag-sdk","cat-8-id","has_thumb"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld<\/title>\n<meta name=\"description\" content=\"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld\" \/>\n<meta property=\"og:description\" content=\"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/\" \/>\n<meta property=\"og:site_name\" content=\"CodexWorld\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/codexworld\" \/>\n<meta property=\"article:published_time\" content=\"2018-05-28T19:10:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-05-28T19:15:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1366\" \/>\n\t<meta property=\"og:image:height\" content=\"768\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"CodexWorld\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@codexworldblog\" \/>\n<meta name=\"twitter:site\" content=\"@codexworldweb\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"CodexWorld\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/\"},\"author\":{\"name\":\"CodexWorld\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\"},\"headline\":\"Login with Facebook in CodeIgniter using JavaScript SDK\",\"datePublished\":\"2018-05-28T19:10:54+00:00\",\"dateModified\":\"2018-05-28T19:15:06+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/\"},\"wordCount\":648,\"commentCount\":5,\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2018\\\/05\\\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png\",\"keywords\":[\"CodeIgniter\",\"Facebook\",\"FacebookAPI\",\"JavaScript\",\"Login\",\"SDK\"],\"articleSection\":[\"CodeIgniter\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/\",\"name\":\"Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2018\\\/05\\\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png\",\"datePublished\":\"2018-05-28T19:10:54+00:00\",\"dateModified\":\"2018-05-28T19:15:06+00:00\",\"description\":\"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2018\\\/05\\\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2018\\\/05\\\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png\",\"width\":1366,\"height\":768,\"caption\":\"login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/codeigniter-facebook-login-javascript-sdk\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.codexworld.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Login with Facebook in CodeIgniter using JavaScript SDK\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#website\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"name\":\"CodexWorld\",\"description\":\"Web &amp; Mobile App Development Company\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.codexworld.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#organization\",\"name\":\"CodexWorld\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.codexworld.com\\\/wp-content\\\/uploads\\\/2014\\\/09\\\/codexworld-logo.png\",\"width\":200,\"height\":19,\"caption\":\"CodexWorld\"},\"image\":{\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldweb\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/codexworld\",\"https:\\\/\\\/www.youtube.com\\\/codexworld\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.codexworld.com\\\/#\\\/schema\\\/person\\\/9da51d8fa3cdefeb5ec9c69136d4baf0\",\"name\":\"CodexWorld\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g\",\"caption\":\"CodexWorld\"},\"description\":\"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.\",\"sameAs\":[\"http:\\\/\\\/www.codexworld.com\",\"https:\\\/\\\/www.facebook.com\\\/codexworld\",\"https:\\\/\\\/x.com\\\/codexworldblog\"],\"url\":\"https:\\\/\\\/www.codexworld.com\\\/author\\\/nitya192265\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld","description":"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/","og_locale":"en_US","og_type":"article","og_title":"Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld","og_description":"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.","og_url":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/","og_site_name":"CodexWorld","article_publisher":"https:\/\/www.facebook.com\/codexworld","article_author":"https:\/\/www.facebook.com\/codexworld","article_published_time":"2018-05-28T19:10:54+00:00","article_modified_time":"2018-05-28T19:15:06+00:00","og_image":[{"width":1366,"height":768,"url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","type":"image\/png"}],"author":"CodexWorld","twitter_card":"summary_large_image","twitter_creator":"@codexworldblog","twitter_site":"@codexworldweb","twitter_misc":{"Written by":"CodexWorld","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#article","isPartOf":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/"},"author":{"name":"CodexWorld","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0"},"headline":"Login with Facebook in CodeIgniter using JavaScript SDK","datePublished":"2018-05-28T19:10:54+00:00","dateModified":"2018-05-28T19:15:06+00:00","mainEntityOfPage":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/"},"wordCount":648,"commentCount":5,"publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"image":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","keywords":["CodeIgniter","Facebook","FacebookAPI","JavaScript","Login","SDK"],"articleSection":["CodeIgniter"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/","url":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/","name":"Login with Facebook in CodeIgniter using JavaScript SDK - CodexWorld","isPartOf":{"@id":"https:\/\/www.codexworld.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#primaryimage"},"image":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#primaryimage"},"thumbnailUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","datePublished":"2018-05-28T19:10:54+00:00","dateModified":"2018-05-28T19:15:06+00:00","description":"CodeIgniter Facebook Login with JavaScript SDK - Learn how to integrate Facebook login in CodeIgniter using JavaScript SDK. Authenticate with Facebook account using JavaScript SDK and retrieve user data from Facebook using Graph API. Example code to implement Facebook login without page refresh in CodeIgniter.","breadcrumb":{"@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#primaryimage","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","width":1366,"height":768,"caption":"login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld"},{"@type":"BreadcrumbList","@id":"https:\/\/www.codexworld.com\/codeigniter-facebook-login-javascript-sdk\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.codexworld.com\/"},{"@type":"ListItem","position":2,"name":"Login with Facebook in CodeIgniter using JavaScript SDK"}]},{"@type":"WebSite","@id":"https:\/\/www.codexworld.com\/#website","url":"https:\/\/www.codexworld.com\/","name":"CodexWorld","description":"Web &amp; Mobile App Development Company","publisher":{"@id":"https:\/\/www.codexworld.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.codexworld.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.codexworld.com\/#organization","name":"CodexWorld","url":"https:\/\/www.codexworld.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","contentUrl":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2014\/09\/codexworld-logo.png","width":200,"height":19,"caption":"CodexWorld"},"image":{"@id":"https:\/\/www.codexworld.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldweb","https:\/\/www.linkedin.com\/company\/codexworld","https:\/\/www.youtube.com\/codexworld"]},{"@type":"Person","@id":"https:\/\/www.codexworld.com\/#\/schema\/person\/9da51d8fa3cdefeb5ec9c69136d4baf0","name":"CodexWorld","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/cf4999db3b409de559f80677afa01729bb2eeda19be273c254e8b2c22729e386?s=96&r=g","caption":"CodexWorld"},"description":"CodexWorld is a programming blog, one-stop destination for web professionals \u2014 developers, programmers, freelancers, and site owners.","sameAs":["http:\/\/www.codexworld.com","https:\/\/www.facebook.com\/codexworld","https:\/\/x.com\/codexworldblog"],"url":"https:\/\/www.codexworld.com\/author\/nitya192265\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.codexworld.com\/wp-content\/uploads\/2018\/05\/login-with-facebook-in-codeigniter-using-javascript-sdk-codexworld.png","jetpack_shortlink":"https:\/\/wp.me\/p6bxIh-R1","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/3287","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/comments?post=3287"}],"version-history":[{"count":2,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/3287\/revisions"}],"predecessor-version":[{"id":3290,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/posts\/3287\/revisions\/3290"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media\/3289"}],"wp:attachment":[{"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/media?parent=3287"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/categories?post=3287"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.codexworld.com\/wp-json\/wp\/v2\/tags?post=3287"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}