Facebook.logInWithReadPermissionsAsync from `expo-facebook` fails on Android with error `An error occurred while trying to log in to Facebook`

user_16607100 0
Viewed 723

I have a redux thunk action for logging in with Facebook in the app I am working on. The action looks like this:

export const loginFB = createAsyncThunk('loginFB', async (_, thunkApi) => {
  await Facebook.initializeAsync({ appId: 'aaa', appName: 'bbb' });
  const FBResponse = await Facebook.logInWithReadPermissionsAsync({ permissions: ['public_profile'] });
  if (FBResponse.type === 'success') {
    // Login in backend. Not really relevant 
  }
});

This works perfectly on iOS and worked well on Android for a long time (from September 2021 I think). I don't know exactly when it happened, but it recently stopped working on Android. The error message I'm getting looks like this:

An error occurred while trying to log in to Facebook
at node_modules/react-native/Libraries/BatchedBridge/NativeModules.js:104:50 in promiseMethodWrapper
at node_modules/expo-modules-core/build/NativeModulesProxy.native.js:27:27 in moduleName.methodInfo.name
at node_modules/expo-facebook/build/Facebook.js:69:36 in logInWithReadPermissionsAsync
at node_modules/expo-facebook/build/Facebook.js:64:7 in logInWithReadPermissionsAsync
at src/screens/LoginScreen.tsx:151:41 in FacebookButton.props.onPress
- ... 16 more stack frames from framework internals

If the Facebook app is installed on the Android device, a Facebook loading modal briefly appears before disappearing. If it's not installed this message pops up: Screenshot of Facebook error

I have followed every step in the documentation and added hashes of both Upload key certificate and App signing key certificate from the Play Console used to sign the app. The Facebook developer Android platform is configured like this: Facebook Developer screenshot.

The code hasn't been touched since it was working except for this addition to the app.json:

{
  "expo": {
    ...
    "plugins": [
      [
        "expo-facebook",
        {
          "userTrackingPermission": false
        }
      ]
    ],
    ...
  }
}

I have tried removing this addition, but the same error occurs.

Using Expo 44.0.5 and expo-facebook version 12.1.0

I really don't know how to approach this problem anymore, please help

UPDATE: 01.02.2022

The problem has been temporarily solved by downgrading to Expo SDK 43. I still don't know the cause of the problem, but it seems to work well. The changelog doesn't document any breaking changes with expo-facebook.

UPDATE: 20.09.2022

The problem has been solved by upgrading to Expo SDK 46 and use react-native-fbsdk-next instead of expo-facebook. I guess this solution was inevitable.

expo react-native facebook android
1 Answers

I had the same issue with the exact same versions as you're using.

The way that I fixed it atm was to change the behaviour for Android, so when I'm initialising Facebook.initializeAsync instead of passing an object I'm just sending the appId param.

So it will look something like this:

    let options = null;
    if (Platform.OS === 'android') {
      options = '<APP_ID>';
    }
    else {
      options = {
        appId: '<APP_ID>',
        version: 'v9.0',
        appName: '<APP_NAME>',
      };
    }

    await Facebook.initializeAsync(options);

Hope this works for you as well.

user_180437390
Related