Enabling Chrome Custom Tabs for Facebook login using Android SDK

Question

I am using Facebook SDK version 4.11.0 in my app.

As per the steps outlined on the Official docs page, I have added following things inside manifest file to enable Chrome Custom Tabs.

<activity
    android:name="com.facebook.FacebookActivity"
    android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.Translucent.NoTitleBar" />

<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>

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

fb_login_protocol_scheme is added to strings.xml with value 'fb+app_id'

Authentication process is working fine without any issue.
Only concern is when I click on login button, the login dialog doesn't opens up in Chrome Custom Tabs but in the usual webview dialog format.

Is there something here missing to be added to the project to enable Chrome Custom Tabs?

Answer 1

You can check why Chrome Custom Tabs doesn't work with this snippet:

private static final String CUSTOM_TABS_SERVICE_ACTION = "android.support.customtabs.action.CustomTabsService";
private static final String CHROME_PACKAGE = "com.android.chrome";

private boolean isCustomTabsAllowed(Context context) {
    boolean isCustomTabsAllowed = true;

    if (!isCustomTabsEnabled(context)) {
        Log.d(TAG, "isCustomTabsEnabled false");
        isCustomTabsAllowed = false;
    }

    if (!isChromeCustomTabsSupported(context)) {
        Log.d(TAG, "isChromeCustomTabsSupported false");
        isCustomTabsAllowed = false;
    }

    if (!Validate.hasCustomTabRedirectActivity(context)) {
        Log.d(TAG, "hasCustomTabRedirectActivity false");
        isCustomTabsAllowed = false;
    }

    return isCustomTabsAllowed;
}

private boolean isCustomTabsEnabled(Context context) {
    final String appId = Utility.getMetadataApplicationId(context);
    final Utility.FetchedAppSettings settings = Utility.getAppSettingsWithoutQuery(appId);
    return settings != null && settings.getCustomTabsEnabled();
}

private boolean isChromeCustomTabsSupported(final Context context) {
    Intent serviceIntent = new Intent(CUSTOM_TABS_SERVICE_ACTION);
    serviceIntent.setPackage(CHROME_PACKAGE);
    List<ResolveInfo> resolveInfos =
            context.getPackageManager().queryIntentServices(serviceIntent, 0);
    return !(resolveInfos == null || resolveInfos.isEmpty());
}

These are the methods called by the Facebook SDK before launch the Chrome Custom Tabs, so simply calling isCustomTabsAllowed you can understand what's wrong with your app.

If isCustomTabsEnabled is false there is some problem in the configuration of your app. Verify on Facebook console under App Review section that the app is live and available to the public.

If isChromeCustomTabsSupported is false probably you have an older version of Chrome that doesn't support the Chrome Custom Tabs, try to update to the last version of Chrome.

If hasCustomTabRedirectActivity is false there are some issues in the integration, verify that you correctly followed all the steps indicated in the guide. Also verify that the APP_ID is the same used in the string facebook_app_id otherwise the login dialog won't use the Chrome Custom Tabs.