React Native: Hướng dẫn setup FacebookSDK với package react-native-fbsdk-next

Cài đặt package

npm i react-native-fbsdk-next

Tạo app trên Meta Developer

Tạo app trên page https://developers.facebook.com/

Trong mục App Settings > Basic, Thêm các platform tương ứng với Android và IOS App

Cấu hình source Android

Tham khảo hướng dẫn này

Mở file android > app > build.gradle thêm vào mục dependencies nội dung:

implementation 'com.facebook.android:facebook-android-sdk:latest.release'

Mở file MainApplication.kt trong android/app/src/main và thêm vào nội dung

...
import com.facebook.FacebookSdk
...
 
class MainApplication : Application(), ReactApplication {
 
...
 
    override fun onCreate() {
        super.onCreate()
         ....
        FacebookSdk.sdkInitialize(applicationContext)
        .....
    }
 
...
 
}

Mở file android/app/src/main/res/values/strings.xml và thêm vào nội dung:

<string name="facebook_app_id">1234</string>
<string name="facebook_client_token">56789</string>

Thông tin chính xác lấy từ apps đã đăng ký trên Meta Developers xuống.

Mở file android/app/manifests/AndroidManifest.xml, thêm vào các nội dung sau:

<application android:label="@string/app_name" ...>
    ...
    <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"/>
    ...
</application>

Mục use-permissions sau application thêm vào

<uses-permission android:name="android.permission.INTERNET"/>

Chạy app trên thiết bị và test lại

npx expo run:android --device

Cấu hình source IOS

Vào thư mục ios và chạy lệnh

pod install

Mở file Info.plist thêm vào các key sau

<key>CFBundleURLTypes</key>
<array>
  <dict>
  <key>CFBundleURLSchemes</key>
  <array>
    <string>fbAPP-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>

Bên mục Targets > Signin and Capabilities, Nhấn + Capabilities và thêm vào Keychain Sharing capability
Mở file AppDelegate.mm, thêm vào nội dung #import và trong hàm didFinishLaunchingWithOptions

#import <AuthenticationServices/AuthenticationServices.h>
#import <SafariServices/SafariServices.h>
#import <FBSDKCoreKit/FBSDKCoreKit-Swift.h>
 
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  ...
 
  [[FBSDKApplicationDelegate sharedInstance] application:application
                    didFinishLaunchingWithOptions:launchOptions];
  
  ...
}

Chạy lệnh run app trên thiết bị và kiểm tra

npx expo run:ios --device

Còn lại setup Login với Facebook hay gì thì tham khảo doc