@capacitor-community/facebook-login
ปลั๊กอินชุมชนตัวเก็บประจุสำหรับการเข้าสู่ระบบ Facebook แบบเนทีฟ
ผู้ดูแล | GitHub | ทางสังคม | บริษัทสปอนเซอร์ |
---|---|---|---|
มาซาฮิโกะ ซากากิบาระ | เรดลาโบ | @rdlabo | RELATION DESIGN LABO, สมาคม GENERAL INC |
ทำด้วยผู้มีส่วนร่วม-img
รหัสสาธิตอยู่ที่นี่
หากคุณต้องการทราบเวอร์ชันไลบรารีของ Facebook คุณควรตรวจสอบ:
% npm i --save @capacitor-community/facebook-login
% npx cap update
ผู้ใช้ Capacitor v5 ควรใช้ปลั๊กอินเวอร์ชัน v5
% npm install @capacitor-community/facebook-login@5
ในไฟล์ android/app/src/main/AndroidManifest.xml
ให้เพิ่มองค์ประกอบ XML ต่อไปนี้ภายใต้ <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 " />
ในไฟล์ android/app/src/main/res/values/strings.xml
เพิ่มบรรทัดต่อไปนี้:
< string name = " facebook_app_id " >[APP_ID]</ string >
< string name = " facebook_client_token " >[CLIENT_TOKEN]</ string >
อย่าลืมแทนที่ [APP_ID]
และ [CLIENT_TOKEN]
ด้วยรหัสแอปพลิเคชัน Facebook ของคุณ
สามารถดูข้อมูลเพิ่มเติมได้ที่นี่: https://developers.facebook.com/docs/android/getting-started
โปรดรีสตาร์ท Android Studio และทำ build ใหม่ทั้งหมด
ในไฟล์ ios/App/App/AppDelegate.swift
เพิ่มหรือแทนที่ข้อมูลต่อไปนี้:
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 )
}
}
}
เพิ่มสิ่งต่อไปนี้ในไฟล์ ios/App/App/info.plist
ภายในส่วนนอกสุด <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 >
สามารถดูข้อมูลเพิ่มเติมได้ที่นี่: https://developers.facebook.com/docs/facebook-login/ios
import { FacebookLogin } from '@capacitor-community/facebook-login' ;
// use hook after platform dom ready
await FacebookLogin . initialize ( { appId : '105890006170720' } ) ;
สามารถดูข้อมูลเพิ่มเติมได้ที่นี่: https://developers.facebook.com/docs/facebook-login/web และคุณต้องยืนยันประเภทการส่งคืนที่ https://github.com/rdlabo/capacitor-facebook-login/blob/master /src/web.ts#L55-L57 ไม่ใช่ประเภทเดียวกันสำหรับการเข้าสู่ระบบ Facebook ทางเว็บเริ่มต้น!
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 } ` ) ;
}
import { FacebookLogin } from '@capacitor-community/facebook-login' ;
await FacebookLogin . logout ( ) ;
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 } ` ) ;
}
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 } ` ) ;
initialize(...)
login(...)
logout()
reauthorize()
getCurrentAccessToken()
getProfile(...)
logEvent(...)
setAutoLogAppEventsEnabled(...)
setAdvertiserTrackingEnabled(...)
setAdvertiserIDCollectionEnabled(...)
initialize ( options : Partial < FacebookConfiguration > ) => Promise < void >
พารามิเตอร์ | พิมพ์ |
---|---|
options | Partial<FacebookConfiguration> |
login ( options : { permissions : string [ ] ; } ) = > Promise < FacebookLoginResponse >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { permissions: string[]; } |
ส่งคืน: Promise<FacebookLoginResponse>
logout ( ) = > Promise < void >
reauthorize ( ) = > Promise < FacebookLoginResponse >
ส่งคืน: Promise<FacebookLoginResponse>
getCurrentAccessToken ( ) = > Promise < FacebookCurrentAccessTokenResponse >
ส่งคืน: Promise<FacebookCurrentAccessTokenResponse>
getProfile < T extends Record < string , unknown > > ( options : { fields : readonly string [ ] ; } ) => Promise < T >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { fields: readonly string[]; } |
ผลตอบแทน: Promise<T>
logEvent ( options : { eventName : string ; } ) = > Promise < void >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { eventName: string; } |
setAutoLogAppEventsEnabled ( options : { enabled : boolean ; } ) = > Promise < void >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { enabled: boolean; } |
setAdvertiserTrackingEnabled ( options : { enabled : boolean ; } ) = > Promise < void >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { enabled: boolean; } |
setAdvertiserIDCollectionEnabled ( options : { enabled : boolean ; } ) = > Promise < void >
พารามิเตอร์ | พิมพ์ |
---|---|
options | { enabled: boolean; } |
ข้อเสนอ | พิมพ์ |
---|---|
appId | string |
autoLogAppEvents | boolean |
xfbml | boolean |
version | string |
locale | string |
ข้อเสนอ | พิมพ์ |
---|---|
accessToken | AccessToken | null |
recentlyGrantedPermissions | string[] |
recentlyDeniedPermissions | string[] |
ข้อเสนอ | พิมพ์ |
---|---|
applicationId | string |
declinedPermissions | string[] |
expires | string |
isExpired | boolean |
lastRefresh | string |
permissions | string[] |
token | string |
userId | string |
ข้อเสนอ | พิมพ์ |
---|---|
accessToken | AccessToken | null |
ทำให้คุณสมบัติทั้งหมดใน T เป็นทางเลือก
{ [P in keyof T]?: T[P]; }
สร้างประเภทด้วยชุดคุณสมบัติ K ประเภท T
{ [P in K]: T; }