Notoriously Psychedelic Modules

    @capacitor-community/facebook-login
    TypeScript icon, indicating that this package has built-in type declarations

    3.2.0 • Public • Published


    Facebook Login

    @capacitor-community/facebook-login

    Capacitor community plugin for native Facebook Login.


    Maintainers

    Maintainer GitHub Social Sponsoring Company
    Masahiko Sakakibara rdlabo @rdlabo RELATION DESIGN LABO, GENERAL INC. ASSOCIATION

    Mainteinance Status: Actively Maintained

    Contributors

    Made with contributors-img.

    Demo

    Demo code is here.

    Installation

    % npm i --save @capacitor-community/facebook-login
    % npx cap update

    Android configuration

    In file android/app/src/main/java/**/**/MainActivity.java, add the plugin to the initialization list:

    public class MainActivity extends BridgeActivity {
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            registerPlugin(com.getcapacitor.community.facebooklogin.FacebookLogin.class);
        }
    }

    In file android/app/src/main/AndroidManifest.xml, add the following XML elements under <manifest><application> :

    <meta-data android:name="com.facebook.sdk.ApplicationId" android:value="@string/facebook_app_id"/>
    <meta-data android:name="com.facebook.sdk.ClientToken" android:value="@string/facebook_client_token"/>

    In file android/app/src/main/res/values/strings.xml add the following lines :

    <string name="facebook_app_id">[APP_ID]</string>
    <string name="facebook_client_token">[CLIENT_TOKEN]</string>

    Don't forget to replace [APP_ID] and [CLIENT_TOKEN] by your Facebook application Id.

    More information can be found here: https://developers.facebook.com/docs/android/getting-started

    If you have trouble.

    Please restart Android Studio, and do clean build.

    iOS configuration

    In file ios/App/App/AppDelegate.swift add or replace the following:

    import UIKit
    import Capacitor
    import FBSDKCoreKit
    
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate {
    
        var window: UIWindow?
    
        func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
            // Override point for customization after application launch.
            FBSDKCoreKit.ApplicationDelegate.shared.application(
                application,
                didFinishLaunchingWithOptions: launchOptions
            )
    
            return true
        }
    
        ...
    
        func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
            // Called when the app was launched with a url. Feel free to add additional processing here,
            // but if you want the App API to support tracking app url opens, make sure to keep this call
            if (FBSDKCoreKit.ApplicationDelegate.shared.application(
                app,
                open: url,
                sourceApplication: options[UIApplication.OpenURLOptionsKey.sourceApplication] as? String,
                annotation: options[UIApplication.OpenURLOptionsKey.annotation]
            )) {
                return true;
            } else {
                return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
            }
        }
    }

    Add the following in the ios/App/App/info.plist file inside of the outermost <dict>:

    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>fb[APP_ID]</string>
            </array>
        </dict>
    </array>
    <key>FacebookAppID</key>
    <string>[APP_ID]</string>
    <key>FacebookClientToken</key>
    <string>[CLIENT_TOKEN]</string>
    <key>FacebookDisplayName</key>
    <string>[APP_NAME]</string>
    <key>LSApplicationQueriesSchemes</key>
    <array>
        <string>fbapi</string>
        <string>fbapi20130214</string>
        <string>fbapi20130410</string>
        <string>fbapi20130702</string>
        <string>fbapi20131010</string>
        <string>fbapi20131219</string>
        <string>fbapi20140410</string>
        <string>fbapi20140116</string>
        <string>fbapi20150313</string>
        <string>fbapi20150629</string>
        <string>fbapi20160328</string>
        <string>fbauth</string>
        <string>fb-messenger-share-api</string>
        <string>fbauth2</string>
        <string>fbshareextension</string>
    </array>

    More information can be found here: https://developers.facebook.com/docs/facebook-login/ios

    Web configuration

    window.fbAsyncInit = function() {
      FB.init({
        appId: '[APP_ID]',
        cookie: true, // enable cookies to allow the server to access the session
        xfbml: true, // parse social plugins on this page
        version: 'v5.0' // use graph api current version
      });
    };
    
    // Load the SDK asynchronously
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "https://connect.facebook.net/en_US/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

    More information can be found here: https://developers.facebook.com/docs/facebook-login/web And you must confirm return type at https://github.com/rdlabo/capacitor-facebook-login/blob/master/src/web.ts#L55-L57 not same type for default web facebook login!

    Example

    Login

    import { FacebookLogin, FacebookLoginResponse } from '@capacitor-community/facebook-login';
    
    const FACEBOOK_PERMISSIONS = ['email', 'user_birthday', 'user_photos', 'user_gender'];
    const result = await <FacebookLoginResponse>FacebookLogin.login({ permissions: FACEBOOK_PERMISSIONS });
    
    if (result.accessToken) {
      // Login successful.
      console.log(`Facebook access token is ${result.accessToken.token}`);
    }

    Logout

    import { FacebookLogin } from '@capacitor-community/facebook-login';
    
    await FacebookLogin.logout();

    CurrentAccessToken

    import { FacebookLogin, FacebookLoginResponse } from '@capacitor-community/facebook-login';
    
    const result = await <FacebookLoginResponse>FacebookLogin.getCurrentAccessToken();
    
    if (result.accessToken) {
      console.log(`Facebook access token is ${result.accessToken.token}`);
    }

    getProfile

    import { FacebookLogin, FacebookLoginResponse } from '@capacitor-community/facebook-login';
    
    const result = await FacebookLogin.getProfile<{
          email: string;
        }>({ fields: ['email'] });
    
    console.log(`Facebook user's email is ${result.email}`);

    API

    login(...)

    login(options: { permissions: string[]; }) => Promise<FacebookLoginResponse>
    Param Type
    options { permissions: string[]; }

    Returns: Promise<FacebookLoginResponse>


    logout()

    logout() => Promise<void>

    getCurrentAccessToken()

    getCurrentAccessToken() => Promise<FacebookCurrentAccessTokenResponse>

    Returns: Promise<FacebookCurrentAccessTokenResponse>


    getProfile(...)

    getProfile<T extends object>(options: { fields: readonly string[]; }) => Promise<T>
    Param Type
    options { fields: readonly string[]; }

    Returns: Promise<T>


    Interfaces

    FacebookLoginResponse

    Prop Type
    accessToken AccessToken | null
    recentlyGrantedPermissions string[]
    recentlyDeniedPermissions string[]

    AccessToken

    Prop Type
    applicationId string
    declinedPermissions string[]
    expires string
    isExpired boolean
    lastRefresh string
    permissions string[]
    token string
    userId string

    FacebookCurrentAccessTokenResponse

    Prop Type
    accessToken AccessToken | null

    Install

    npm i @capacitor-community/facebook-login

    DownloadsWeekly Downloads

    5,924

    Version

    3.2.0

    License

    MIT

    Unpacked Size

    60.8 kB

    Total Files

    29

    Last publish

    Collaborators

    • capcombot
    • jcesarmobile
    • maxlynch
    • mhartington
    • dotnetkow
    • it_mike_s
    • byrds
    • rdlabo
    • priyankpatel
    • dwieeb
    • stewan
    • arielhernandezmusa
    • jeepq
    • start9keagan
    • boosten
    • nklayman
    • ihadeed
    • danielprr
    • ckgaparajita
    • jpender
    • nhyatt
    • pwespi
    • epicshaggy
    • thomasvidas
    • robingenz
    • diachedelic
    • johnborges
    • tobyas
    • elylucas
    • larsmikkelsen
    • giodimiliaionic
    • brownoxford
    • mrbatista
    • bazuka5801
    • hemang