Cordova plugin facebook allows the developers to enable social login for their applications. this plugin is used for authentication purpose and we can also get user’s information such as public profile, birthday, friends list, and much more.
We also have few advantages with this social login, such as increased conversion rate, easy to authenticate, no password, and much more.
Adding Plugin
Create Facebook ID & Application
<span class="hljs-string">cordova </span><span class="hljs-string">plugin </span><span class="hljs-string">add </span><span class="hljs-string">cordova-plugin-</span><span class="hljs-string">facebook4 </span><span class="hljs-built_in">--save</span> <span class="hljs-built_in">--variable</span> <span class="hljs-string">APP_ID=</span><span class="hljs-string">"YOUR_FB_APPID"</span> <span class="hljs-built_in">--variable</span> <span class="hljs-string">APP_NAME=</span><span class="hljs-string">"YOUR_FB_APPNAME"</span>
Example Code
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">loginWithFB</span>() </span>{
facebookConnectPlugin.login([<span class="hljs-string">"public_profile"</span>, <span class="hljs-string">"email"</span>], <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">result</span>) </span>{
<span class="hljs-comment">//calling api after login success</span>
facebookConnectPlugin.api(<span class="hljs-string">"/me?fields=email,name,picture"</span>,
[<span class="hljs-string">"public_profile"</span>, <span class="hljs-string">"email"</span>],
<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">userData</span>) </span>{
<span class="hljs-comment">//API success callback</span>
alert(<span class="hljs-built_in">JSON</span>.stringify(userData));
},
<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">error</span>) </span>{
<span class="hljs-comment">//API error callback</span>
alert(<span class="hljs-built_in">JSON</span>.stringify(error));
});
}, <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">error</span>) </span>{
<span class="hljs-comment">//authenication error callback</span>
alert(<span class="hljs-built_in">JSON</span>.stringify(error));
});
}