expo: Facebook login not working with SDK35 after SDK36 release

Description

expo-cli 3.11.1 nerfed facebook login. A hour ago, before upgrading expo-cli this code used to work perfectly.

Expected Behavior

An hour ago before updating expo-cli this code worked perfectly

`const { type, token } = await Facebook.logInWithReadPermissionsAsync(‘< my actual facebook project id >’, { permissions: [‘public_profile’, ‘email’] }).catch(function(error) { // Handle Errors here.

    let errorCode = error.code;
    let errorMessage = error.message;
    // The email of the user's account used.
   let email = error.email;
   // The firebase.auth.AuthCredential type that was used.
   let credential = error.credential;
  console.log(errorCode, ' ', errorMessage, ' ', email, ' ', credential, ' ',);

});`

I also tried Facebook.initializeAsync but that did not work either

Observed Behavior

Error from facebook is E_FBLOGIN_APP_ID Tried to perform Facebook login, but no Facebook app id was provided. Specify Facebook app id in Info.plist.

error from expo is

undefined is not an object (evaluating '_ref.type')
* src/actions/user.js:82:11 in _callee3$
- node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/@babel/runtime/node_modules/regenerator-runtime/runtime.js:271:30 in invoke
- ... 13 more stack frames from framework internals

If I run Facebook.initializeAsync . I get

Facebook.initializeAsync is not a function

Environment

Expo CLI 3.11.1 environment info: System: OS: macOS 10.14.6 Shell: 3.2.57 - /bin/bash Binaries: Node: 13.2.0 - /usr/local/bin/node Yarn: 1.19.2 - /usr/local/bin/yarn npm: 6.13.1 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman IDEs: Android Studio: 3.5 AI-191.8026.42.35.5977832 Xcode: 11.3/11C29 - /usr/bin/xcodebuild npmPackages: expo: ^35.0.0 => 35.0.1 react: 16.8.3 => 16.8.3 react-native: https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz => 0.59.8 react-navigation: ^4.0.10 => 4.0.10 npmGlobalPackages: expo-cli: 3.11.1

“expo-facebook”: “~7.0.1”, does not work on ^8.0.0 either

Emulator is iPhone 11 Pro Max 13.3 Phone 1 is Pixel 3 Android version 10 Phone 2 is Samsung S8 Android version 9

Reproducible Demo

I am not sure how to do this…

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 58 (21 by maintainers)

Commits related to this issue

Most upvoted comments

hey all, a solution for people who don’t want to or aren’t ready to upgrade to SDK 36 yet. Apparently the new Expo client (v2.14.1) is set up to only work with the new SDK 36 Facebook module approach. To still be able to use Facebook Login on SDK 35 projects, you have to delete the client from your phone / simulator and then use the expo client:install:ios command from the cli. This will prompt you to install the correct version of the client for your project (i.e. v2.13.0 for SDK 35). This also requires one of the newer versions of the CLI, not sure which, but run npm install expo-cli -g if you’re unsure if you have the latest version. This allows you to use Facebook Login again on SDK 35. I assume it’s same for earlier versions of Expo as well.

I spent hours trying to solve this problem. For my solution I did the following:

1 - I updated my application using expo upgrade. (Upgraded to sdk version 36, previously used 35).

2 - I ran the application again

3 - I updated in my login function the initialization of the facebook SDK. (“Facebook.initializeAsync (” APP_ID "))

4 - Login tested normally and functional.

No, Facebook.initializeAsync should be used on both platforms, but it is required only on SDK36. I have just run published NCL on SDK36 and confirmed that the function works as expected on Android on latest Expo client.

Are you sure you’re:

  • running SDK36 experience
  • using expo-facebook@8.0.0
  • importing Facebook like import * as Facebook from "expo-facebook"; ?

I have ensured that my expo is the most up-to-date

My package.json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-firebase/app": "^6.2.0",
    "@react-native-firebase/auth": "^6.2.0",
    "@react-native-firebase/firestore": "^6.2.0",
    "@react-native-firebase/storage": "^6.2.0",
    "expo": "^36.0.0",
    "expo-av": "~8.0.0",
    "expo-camera": "~8.0.0",
    "expo-contacts": "~8.0.0",
    "expo-facebook": "~8.0.0",
    "expo-image-picker": "~8.0.0",
    "expo-permissions": "~8.0.0",
    "firebase": "^7.5.2",
    "react": "16.9.0",
    "react-dom": "16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
    "react-native-fbsdk": "^1.1.1",
    "react-native-gesture-handler": "~1.5.0",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-reanimated": "~1.4.0",
    "react-native-snap-carousel": "^3.8.4",
    "react-native-svg": "9.13.3",
    "react-native-svg-charts": "^5.3.0",
    "react-native-vector-icons": "^6.6.0",
    "react-native-video": "^5.0.2",
    "react-native-web": "^0.11.7",
    "react-native-webview": "7.4.3",
    "react-navigation": "^4.0.10",
    "react-navigation-stack": "^1.10.3",
    "react-navigation-tabs": "^2.6.2"
  },
  "devDependencies": {
    "@babel/core": "^7.7.5",
    "@babel/runtime": "^7.7.6",
    "@react-native-community/eslint-config": "^0.0.5",
    "babel-jest": "^24.9.0",
    "babel-preset-expo": "^8.0.0",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.57.0",
    "react-test-renderer": "16.12.0"
  },
  "private": true
}

And I am importing it as referenced above and in the docs.

I have moved my project over to my laptop and I am receiving the same error aswell, on a different laptop, different connection, same project.

My login code:

const appId = 'app id here';
    const permissions = ['public_profile', 'email'];  // Permissions required, consult Facebook docs

    await Facebook.initializeAsync(appId);

    const {
      type,
      token,
    } = await Facebook.logInWithReadPermissionsAsync(
      appId,
      { permissions }
    );

with respect to the initializeAsync issue you encountered - I believe you were reading the SDK36 docs for the Facebook module, because this method did not exist in SDK35: https://docs.expo.io/versions/v35.0.0/sdk/facebook/

Has anyone had any breakthrough with this?

Any updates on it? I can’t upgrade to SDK 36 since it will cause other things to break (like push notifications on closed apps: https://github.com/expo/expo/issues/3663)

@sjchmiela Not sure, we should close this yet. What about iOS? This issue is still present on iOS too when you have a project running SDK 35 (with expo-facebook@7.0) and you try to do Facebook Login on Expo client v2.14 or above, using SDK 35 methodologies (i.e. without initialization). Only having the cli install the Expo client v2.13 seems to solve this for now.

@SeanRenet thanks for reporting this! @sjchmiela I repro’d this locally in the most recent expo client (2.14.1), with sdk 35, expo-facebook ~7.0.0

try {
      await Facebook.logInWithReadPermissionsAsync(
        APP_ID
      );
    } catch (e) {
      alert(e);
    }

CLI = command line interface app that runs on phone = expo client app

so this is why i’m saying that it’s not related to the CLI, it’s likely related to unintentional changes to SDK35 caused by adding SDK36 to the expo client app

@cruzach is investigating this now and trying to reproduce it

May I just run another sanity question: what is your sdkVersion in app.json? Sorry for asking obvious questions…

No, Facebook.initializeAsync should be used on both platforms, but it is required only on SDK36. I have just run published NCL on SDK36 and confirmed that the function works as expected on Android on latest Expo client.

Are you sure you’re:

  • running SDK36 experience
  • using expo-facebook@8.0.0
  • importing Facebook like import * as Facebook from "expo-facebook"; ?

@brentvatne I don’t want to make another issue because I feel that the error is very direct, but when I try to use Facebook.initializeAsync(“myappid”) it immediately tells me that “Facebook Login Error: The method or property Facebook.initializeAsync is not available on android, are you sure you’ve linked all the native dependencies properly?”

Is Facebook.initializeAsync iOS specific?