Orchestration SDKs

Step 3. Configuring native provider SDKs

PingOne React Native

The External IdP module authenticates users with the native SDK of each provider, giving users a smooth, integrated sign-in experience.

The module prefers the native SDK for each identity provider, but falls back to a browser redirect when the native SDK is not linked.

You should therefore link the native SDK for each provider you want to support, to give users the native sign-in experience.

You can always add more providers later by following the relevant section below.

The availability of each provider varies by platform:

Provider Android iOS

Apple

No

Yes

Facebook

Yes

Yes

Google

Yes

Yes
Apple

Configure Sign in with Apple on iOS
Facebook

Configure Facebook Login on Android and iOS
Google

Configure Sign in with Google on Android and iOS

Implementing Sign in with Apple

Apple sign-in is available on iOS only.

Configuring Sign in with Apple on iOS

To add and configure the Sign in with Apple native SDK on iOS, complete the following steps:

Step 1. Add the Sign in with Apple pod

Add the following to your ios/Podfile:

pod 'PingExternalIdPApple'

Run pod install after updating your Podfile.

Step 2. Add the Sign in with Apple capability

In Xcode, select your project and navigate to Targets > Signing & Capabilities.

Click Capability and double-click Sign in with Apple.

Apple sign-in does not require callback URL routing in your app delegate.

Implementing the Facebook Login native SDK

To enable Facebook Login in your React Native app, complete the steps in this section on the platforms you want to support:

Configuring Facebook Login on Android

To add and configure the Facebook Login SDK on Android, complete the following steps:

Step 1. Add the Facebook Login dependency

Add the following to the dependencies block in your android/app/build.gradle file:

Adding the Facebook Login dependency on Android
dependencies {
    implementation("com.facebook.android:facebook-login:18.0.3")
}

Step 2. Register your Android app with Facebook

Follow the Facebook Login for Android Quickstart to register your app and generate key hashes, then continue below.

Step 3. Add Facebook configuration to your Android app

  1. In android/app/src/main/res/values/strings.xml, add your Facebook app credentials:

    Adding Facebook credentials to strings.xml
    <resources>
    <string name="facebook_app_id">YOUR_FACEBOOK_APP_ID</string>
    <string name="fb_login_protocol_scheme">fbYOUR_FACEBOOK_APP_ID</string>
    <string name="facebook_client_token">YOUR_CLIENT_TOKEN</string>
</resources>

    Replace the placeholders with values from your app in the Meta for Developers console.

    YOUR_FACEBOOK_APP_ID

    Click the App ID label in the header bar of the Meta Developer site for your app to copy the value.

    Replace both YOUR_FACEBOOK_APP_ID placeholders in the snippet above, but keep the fb prefix on the second value.

    YOUR_CLIENT_TOKEN

    In the Meta Developer site, navigate to App Settings > Advanced > Security, and copy the Client token value.

    Do not use the App secret value found in App settings > Basic in your client applications.

  2. In android/app/src/main/AndroidManifest.xml, add the following inside the <application> element:

    Registering the Facebook SDK in AndroidManifest.xml
    <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" />

<activity android:name="com.facebook.CustomTabActivity" android:exported="true">
    <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="@string/fb_login_protocol_scheme"/>
    </intent-filter>
</activity>

Configuring Facebook Login on iOS

To add and configure the Facebook Login SDK on iOS, complete the following steps:

Step 1. Add the Facebook Login pod

Add the following to your ios/Podfile:

pod 'PingExternalIdPFacebook'

Run pod install after updating your Podfile.

Step 2. Register your iOS app with Facebook

Follow the Facebook Login for iOS Quickstart to register your app bundle ID, then continue below.

Step 3. Add Facebook configuration to your iOS app

  1. In ios/<YourApp>/Info.plist, add the following keys with values from your app in the Meta for Developers console:

    Adding Facebook credentials to Info.plist on iOS
    <key>FacebookAppID</key>
<string>YOUR_FACEBOOK_APP_ID</string>
<key>FacebookClientToken</key>
<string>YOUR_CLIENT_TOKEN</string>
<key>FacebookDisplayName</key>
<string>YOUR_APP_DISPLAY_NAME</string>

  2. Add the Facebook URL scheme to CFBundleURLTypes in Info.plist. The scheme is fb followed by your Facebook App ID:

    Registering the Facebook URL scheme in Info.plist
    <key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLName</key>
        <string>facebook-login</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>fbYOUR_FACEBOOK_APP_ID</string>
        </array>
    </dict>
</array>

Step 4. Route Facebook callback URLs

In your React Native app’s iOS app delegate, route incoming Facebook callback URLs to the native handler:

Routing Facebook callback URLs in the iOS app delegate
#if canImport(PingExternalIdPFacebook)
import PingExternalIdPFacebook
#endif

func application(
  _ application: UIApplication,
  open url: URL,
  options: [UIApplication.OpenURLOptionsKey: Any] = [:]
) -> Bool {
  var handled = false
#if canImport(PingExternalIdPFacebook)
  handled = FacebookHandler.handleOpenURL(application, url: url, options: options)
#endif
  return handled
}

Implementing the Sign in with Google native SDK

To enable Sign in with Google in your React Native app, complete the steps in this section on the platforms you want to support:

Configuring Sign in with Google on Android

To add and configure the Google Sign-In SDK on Android, complete the following steps:

Step 1. Add the Google Sign-In dependencies

Add the following to the dependencies block in your android/app/build.gradle file:

Adding the Google Sign-In dependencies on Android
dependencies {
    // Google Sign-In
    implementation("com.google.android.libraries.identity.googleid:googleid:1.1.1")

    // Required for devices running Android 13 and earlier
    implementation("androidx.credentials:credentials-play-services-auth:1.5.0")
}

If your app only targets Android 14 and later you can omit the credentials-play-services-auth dependency.

Step 2. Create Android-specific credentials in Google Cloud

The native Google SDK requires an Android-specific OAuth 2.0 client ID so it can authenticate users directly from the app.

This is separate from the web application client you configured in Configuring social sign-on in PingOne for your PingOne external IdP.

  1. In a browser, navigate to the Google API Dashboard.

  2. In the left navigation, click Credentials.

  3. Click CREATE CREDENTIALS and select OAuth client ID.

  4. In the Application Type drop-down list, select Android.

  5. Enter a name, your app’s package name, and the SHA-1 fingerprint of your signing certificate.

    Run the following command to retrieve your SHA-1 fingerprint:

    keytool -keystore path-to-keystore -list -v

  6. Click Create.

You do not need to add this client ID to your app or PingOne configuration. Associating the certificate fingerprint with your package name is enough for Google to recognize the app.

Configuring Sign in with Google on iOS

To add and configure the Google Sign-In SDK on iOS, complete the following steps:

Step 1. Add the Google Sign-In pod

Add the following to your ios/Podfile:

pod 'PingExternalIdPGoogle'

Run pod install after updating your Podfile.

Step 2. Create an iOS-specific client profile in Google Cloud

The native Google SDK requires an iOS-specific OAuth 2.0 client ID so it can authenticate users directly from the app.

This is separate from the web application client you configured in Configuring social sign-on in PingOne for your PingOne external IdP.

  1. In a browser, navigate to the Google API Dashboard.

  2. In the left navigation, click Credentials.

  3. Click CREATE CREDENTIALS and select OAuth client ID.

  4. In the Application Type drop-down list, select iOS.

  5. Enter a name and your app’s bundle ID, then click Create.

  6. Open the client you just created and note the Client ID and iOS URL scheme values.

Step 3. Configure your iOS app

  1. In your ios/<YourApp>/Info.plist, add the iOS client ID:

    Adding the Google Sign-In client ID to Info.plist
    <key>GIDClientID</key>
<string>YOUR_IOS_CLIENT_ID</string>

  2. Add the iOS URL scheme from your iOS client to CFBundleURLTypes in Info.plist:

    Registering the Google Sign-In URL scheme in Info.plist
    <key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLName</key>
        <string>google-signin</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>YOUR_IOS_REVERSED_CLIENT_ID</string>
        </array>
    </dict>
</array>

    If CFBundleURLTypes already exists in your Info.plist, add the new entry to the existing array rather than creating a duplicate key.

For example, if your iOS client ID is 1234567890-abcdefghijklmnop.apps.googleusercontent.com, the reversed client ID is com.googleusercontent.apps.1234567890-abcdefghijklmnop.

Step 4. Route Google callback URLs

In your React Native app’s iOS app delegate, route incoming Google callback URLs to the native handler.

Add the following to your AppDelegate:

Routing Google callback URLs in the iOS app delegate
#if canImport(PingExternalIdPGoogle)
import PingExternalIdPGoogle
#endif

func application(
  _ application: UIApplication,
  open url: URL,
  options: [UIApplication.OpenURLOptionsKey: Any] = [:]
) -> Bool {
  var handled = false
#if canImport(PingExternalIdPGoogle)
  handled = GoogleHandler.handleOpenURL(application, url: url, options: options) || handled
#endif
  return handled
}