@freeedcom/capacitor-facebook-login
v6.1.1
Published
A native plugin for Facebook Login
Downloads
1,080
Readme
Installation
% npm i --save @freeedcom/capacitor-facebook-login
% npx cap update
Versions
Users of Capacitor v5 should use version v5 of the Plugin.
% npm install @freeedcom/capacitor-facebook-login@5
Android configuration
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
import { FacebookLogin } from '@freeedcom/capacitor-facebook-login';
// use hook after platform dom ready
await FacebookLogin.initialize({ appId: '105890006170720' });
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 '@freeedcom/capacitor-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}`);
}
Limited Login (iOS only)
Limited Login is a type of login, which is limited in terms of tracking users, with smaller set of available permissions It returns an AuthenticationToken
that wraps an OpenID Connect token, which client then needs to validate. The token already contains all the requested data, so interaction with Graph API is not required.
import {
FacebookLogin,
FacebookLimitedLoginResponse,
} from '@freeedcom/capacitor-facebook-login';
import { v4 as uuidv4 } from 'uuid';
const FACEBOOK_PERMISSIONS = ['email', 'user_birthday', 'user_gender'];
const result = await (<FacebookLimitedLoginResponse>(
FacebookLogin.loginLimitedly({
permissions: FACEBOOK_PERMISSIONS,
nonce: uuidv4(),
})
));
if (result.authenticationToken) {
// Login successful.
console.log(
`Facebook authentication token is ${result.authenticationToken.token}`,
);
}
Logout
import { FacebookLogin } from '@freeedcom/capacitor-facebook-login';
await FacebookLogin.logout();
CurrentAccessToken
import {
FacebookLogin,
FacebookLoginResponse,
} from '@freeedcom/capacitor-facebook-login';
const result = await (<FacebookLoginResponse>(
FacebookLogin.getCurrentAccessToken()
));
if (result.accessToken) {
console.log(`Facebook access token is ${result.accessToken.token}`);
}
Current authentication token (Limited Login, iOS only)
import {
FacebookLogin,
FacebookCurrentAuthenticationTokenResponse,
} from '@freeedcom/capacitor-facebook-login';
const result = await (<FacebookCurrentAuthenticationTokenResponse>(
FacebookLogin.getCurrentAuthenticationToken()
));
if (result.authenticationToken) {
console.log(
`Facebook authentication token is ${result.authenticationToken.token}`,
);
}
getProfile
import {
FacebookLogin,
FacebookLoginResponse,
} from '@freeedcom/capacitor-facebook-login';
const result = await FacebookLogin.getProfile<{
email: string;
}>({ fields: ['email'] });
console.log(`Facebook user's email is ${result.email}`);
API
initialize(...)
login(...)
loginLimitedly(...)
logout()
reauthorize()
getCurrentAccessToken()
getCurrentAuthenticationToken()
getProfile(...)
logEvent(...)
setAutoLogAppEventsEnabled(...)
setAdvertiserTrackingEnabled(...)
setAdvertiserIDCollectionEnabled(...)
- Interfaces
- Type Aliases
initialize(...)
initialize(options: Partial<FacebookConfiguration>) => Promise<void>
| Param | Type |
| ------------- | ------------------------------------------------------------------------------------------------------------- |
| options
| Partial<FacebookConfiguration> |
login(...)
login(options: { permissions: string[]; }) => Promise<FacebookLoginResponse>
| Param | Type |
| ------------- | --------------------------------------- |
| options
| { permissions: string[]; } |
Returns: Promise<FacebookLoginResponse>
loginLimitedly(...)
loginLimitedly(options: { permissions: string[]; nonce: string; }) => Promise<FacebookLimitedLoginResponse>
| Param | Type |
| ------------- | ------------------------------------------------------ |
| options
| { permissions: string[]; nonce: string; } |
Returns: Promise<FacebookLimitedLoginResponse>
logout()
logout() => Promise<void>
reauthorize()
reauthorize() => Promise<FacebookLoginResponse>
Returns: Promise<FacebookLoginResponse>
getCurrentAccessToken()
getCurrentAccessToken() => Promise<FacebookCurrentAccessTokenResponse>
Returns: Promise<FacebookCurrentAccessTokenResponse>
getCurrentAuthenticationToken()
getCurrentAuthenticationToken() => Promise<FacebookCurrentAuthenticationTokenResponse>
Returns: Promise<FacebookCurrentAuthenticationTokenResponse>
getProfile(...)
getProfile<T extends Record<string, unknown>>(options: { fields: readonly string[]; }) => Promise<T>
| Param | Type |
| ------------- | ------------------------------------------- |
| options
| { fields: readonly string[]; } |
Returns: Promise<T>
logEvent(...)
logEvent(options: { eventName: string; }) => Promise<void>
| Param | Type |
| ------------- | ----------------------------------- |
| options
| { eventName: string; } |
setAutoLogAppEventsEnabled(...)
setAutoLogAppEventsEnabled(options: { enabled: boolean; }) => Promise<void>
| Param | Type |
| ------------- | ---------------------------------- |
| options
| { enabled: boolean; } |
setAdvertiserTrackingEnabled(...)
setAdvertiserTrackingEnabled(options: { enabled: boolean; }) => Promise<void>
| Param | Type |
| ------------- | ---------------------------------- |
| options
| { enabled: boolean; } |
setAdvertiserIDCollectionEnabled(...)
setAdvertiserIDCollectionEnabled(options: { enabled: boolean; }) => Promise<void>
| Param | Type |
| ------------- | ---------------------------------- |
| options
| { enabled: boolean; } |
Interfaces
FacebookConfiguration
| Prop | Type |
| ---------------------- | -------------------- |
| appId
| string |
| autoLogAppEvents
| boolean |
| xfbml
| boolean |
| version
| string |
| locale
| string |
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 |
FacebookLimitedLoginResponse
| Prop | Type |
| ------------------------- | --------------------------------------------------------------------------- |
| authenticationToken
| AuthenticationToken | null |
AuthenticationToken
| Prop | Type |
| ----------- | ------------------- |
| token
| string |
FacebookCurrentAccessTokenResponse
| Prop | Type |
| ----------------- | ----------------------------------------------------------- |
| accessToken
| AccessToken | null |
FacebookCurrentAuthenticationTokenResponse
| Prop | Type |
| ------------------------- | --------------------------------------------------------------------------- |
| authenticationToken
| AuthenticationToken | null |
Type Aliases
Partial
Make all properties in T optional
{ [P in keyof T]?: T[P]; }
Record
Construct a type with a set of properties K of type T
{ [P in K]: T; }