React-native-navigation: New compatibility issue with react-native-fbsdk on Android

[amscher]

Issue Description

I'm using Firebase Facebook login in my app, and before using react-native-navigation, it worked perfectly. It still works on iOS, but on Android it seems that the callback functions are no longer called. I've seen multiple issues about this topic in other threads, #410 #373 #240 being the most helpful, however I have had no luck getting it to work after following the suggestions.

These issues were also all opened about a year ago, so I'm wondering if maybe there's a different, new problem that I'm facing... Also these issues it seems are using V2 and I'm using V1. I attempted using V2, however still couldn't get it to work. The relevant code is below, I would really appreciate your help!

Steps to Reproduce / Code Snippets / Screenshots

MainApplication.java

import android.app.Application;
import android.content.Intent;

import com.facebook.CallbackManager;
import com.facebook.FacebookSdk;
import com.facebook.appevents.AppEventsLogger;
import com.facebook.react.ReactApplication;
import io.invertase.firebase.RNFirebasePackage;
import io.invertase.firebase.analytics.RNFirebaseAnalyticsPackage;
import io.invertase.firebase.auth.RNFirebaseAuthPackage;
import io.invertase.firebase.database.RNFirebaseDatabasePackage;
import io.invertase.firebase.storage.RNFirebaseStoragePackage;
import com.facebook.reactnative.androidsdk.FBSDKPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import com.lwansbrough.RCTCamera.RCTCameraPackage;
import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.controllers.ActivityCallbacks;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends NavigationApplication {
  // Added for firebase / fblogin
  private static CallbackManager mCallbackManager = CallbackManager.Factory.create();

  protected static CallbackManager getCallbackManager() {
    return mCallbackManager;
  }

  // Added for react-native-navigation
  @Override
  public boolean isDebug() {
    return BuildConfig.DEBUG;
  }

  // Added for react-native-navigation
  protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
       new RNFirebasePackage(),
       new RNFirebaseAnalyticsPackage(),
       new RNFirebaseDatabasePackage(),
       new RNFirebaseAuthPackage(),
       new FBSDKPackage(mCallbackManager),
       new RNFirebaseStoragePackage(),
       new RCTCameraPackage()
    );
  }

  // Added for react-native-navigation
  @Override
  public List<ReactPackage> createAdditionalReactPackages() {
    return getPackages();
  }

  @Override
  public void onCreate() {
    super.onCreate();
    // To get FBSDK to work
    setActivityCallbacks(new ActivityCallbacks() {
      @Override
      public void onActivityResult(int requestCode, int resultCode, Intent data) {
        mCallbackManager.onActivityResult(requestCode, resultCode, data);
      }
    });
    FacebookSdk.sdkInitialize(getApplicationContext());
    AppEventsLogger.activateApp(this);
    SoLoader.init(this, /* native exopackage */ false);
  }
}

MainActivity.java

import com.facebook.react.ReactActivity;
import com.reactnativenavigation.controllers.SplashActivity;
import android.content.Intent;

public class MainActivity extends SplashActivity {
     @Override
     public void onActivityResult(int requestCode, int resultCode, Intent data) {
         super.onActivityResult(requestCode, resultCode, data);
         MainApplication.getCallbackManager().onActivityResult(requestCode, resultCode, data);
     }
}

LoginForm

LoginManager
    .logInWithReadPermissions(['public_profile', 'email'])
    .then(
             function(result) {console.log("trying to login")},
             function(error) {console.log(error)}
         )

Neither the success or error callbacks are getting called....

---

Environment

• React Native Navigation version: 1.1.298
• React Native version: 0.49.1
• Platform(s) (iOS, Android, or both?): Android
• Device info (Simulator/Device? OS version? Debug/Release?): Device, Moto G (5) Plus - 7.0, Debug

[chaitanya-bhagavan]

Can remove onActivityResult from MainActivity.java and try?

[perrosnk]

@amscher have you found a solution to that?

[TONYHOKAN]

Maybe you have inputed incorrect android Key Hashes to facebook app?

I encountered the same behaviour event if i have followed the solution provided.
Finally i found that it was my mistake and not related to RNN.

I run adb logcat in console to monitor if something wrong when clicking LoginButton in my android app, then below exception thrown:

1634  8688 W fb4a.BlueServiceQueue: Exception during service
1634  8688 W fb4a.BlueServiceQueue: X.3Q7: [code] 404 [message]: Key hash {longstring} does not match any stored key hashes. (404) [extra]: null

I copied the Key hash to my facebook app, clicked LoginButton again and it worked!

I just wondered why the exception was not returned to error object...

[juanlet]

I also have this same problem....

[tarouboy]

After removing onActivityResult inside MainActivity.java I can get the callback.
Hope it helps.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest version and report back. Thank you for your contributions.

[xe4me]

In my case, after adding the onActivityResult like above , it still didn't work, did some debugging and turned out that the SDK was trhowing.

I removed bellow like of code from my React code

LoginManager.setLoginBehavior('native');

[manojkmishra]

I tried many things but nothing is working out. I am working on windows with "react-native": "0.55.4",
"react-native-fbsdk": "^0.7.0", "react-native-navigation": "^1.1.461".

FB app Popup is coming after pressing the button, it takes facebook login/pass verifies it, but after submit, nothing is returned. I tried removing onActivityResult also-- so MainActivity.java looks like this (not sure if this is correct) but still nothing is returned

package com.instagramclone;
import com.reactnativenavigation.controllers.SplashActivity;
import android.content.Intent;

public class MainActivity extends SplashActivity {

// @Override
// public void onActivityResult(int requestCode, int resultCode, Intent data) {
// super.onActivityResult(requestCode, resultCode, data);
// MainApplication.getCallbackManager().onActivityResult(requestCode, resultCode, data);
// }
}

logcat logs

06-13 19:58:50.190 1698-5075/system_process I/ActivityManager: START u0 {act=NATIVE_WITH_FALLBACK cmp=com.fblogintest/com.facebook.FacebookActivity (has extras)} from uid 10098
06-13 19:58:50.270 1408-1408/? D/gralloc_ranchu: gralloc_alloc: Creating ashmem region of size 1642496
06-13 19:58:50.273 1408-1408/? I/chatty: uid=1000(system) [email protected] identical 1 line
06-13 19:58:50.278 1408-1408/? D/gralloc_ranchu: gralloc_alloc: Creating ashmem region of size 1642496
06-13 19:58:50.299 5110-5147/com.fblogintest D/EGL_emulation: eglMakeCurrent: 0xa92414c0: ver 2 0 (tinfo 0xa6cd2910)
06-13 19:58:50.319 5110-5147/com.fblogintest D/EGL_emulation: eglMakeCurrent: 0xa92414c0: ver 2 0 (tinfo 0xa6cd2910)
06-13 19:58:50.343 1698-1724/system_process I/ActivityManager: Displayed com.com.fblogintest/com.facebook.FacebookActivity: +125ms
06-13 19:58:50.344 5110-5147/com.fblogintest D/EGL_emulation: eglMakeCurrent: 0xa92414c0: ver 2 0 (tinfo 0xa6cd2910)
06-13 19:58:50.670 5110-5147/com.fblogintest I/chatty: uid=10098(u0_a98) RenderThread identical 18 lines
06-13 19:58:50.682 5110-5147/com.fblogintest D/EGL_emulation: eglMakeCurrent: 0xa92414c0: ver 2 0 (tinfo 0xa6cd2910)
06-13 19:58:50.691 5110-5110/com.fblogintest D/com.facebook.FacebookSdk: getGraphApiVersion: v3.0
06-13 19:58:50.708 5110-5147/com.fblogintest D/EGL_emulation: eglMakeCurrent: 0xa92414c0: ver 2 0 (tinfo 0xa6cd2910)

[manojkmishra]

Issue got resolved(LoginManager.logInWithReadPermissions promise getting resolved) after modifying onCreate() in MainApplication.java.

MainActivity.java:

package com.instagram_mobile;
import com.reactnativenavigation.controllers.SplashActivity;
import android.content.Intent;
public class MainActivity extends SplashActivity {
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
MainApplication.getCallbackManager().onActivityResult(requestCode, resultCode, data);
}
}

===============================================
MainApplication.java:

package com.instagram_mobile;
import com.facebook.react.ReactPackage;

import com.reactnativenavigation.NavigationApplication;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import com.facebook.CallbackManager;
import com.facebook.reactnative.androidsdk.FBSDKPackage;
import com.facebook.appevents.AppEventsLogger;
import com.facebook.FacebookSdk;

import java.util.Arrays;
import java.util.List;
import com.oblador.vectoricons.VectorIconsPackage;
import com.reactnativenavigation.controllers.ActivityCallbacks;
import android.content.Intent;

public class MainApplication extends NavigationApplication
{ private static CallbackManager mCallbackManager = CallbackManager.Factory.create();
protected static CallbackManager getCallbackManager() { return mCallbackManager; }

@Override
public boolean isDebug() 
{  // Make sure you are using BuildConfig from your own application
    return BuildConfig.DEBUG;
}

protected List<ReactPackage> getPackages() 
{   // Add additional packages you require here
    // No need to add RnnPackage and MainReactPackage
    return Arrays.<ReactPackage>asList(
         new VectorIconsPackage(),
         new RNGestureHandlerPackage(),
         new LinearGradientPackage(),
         new FBSDKPackage(mCallbackManager)
    );
}

@Override
public List<ReactPackage> createAdditionalReactPackages() {   return getPackages();  }

@Override
public String getJSMainModuleName() { return "index";  }

public void onCreate() 
{    super.onCreate();
    setActivityCallbacks(new ActivityCallbacks() 
            {   @Override
                public void onActivityResult(int requestCode, int resultCode, Intent data) 
                {  mCallbackManager.onActivityResult(requestCode, resultCode, data);
                }
            });
    FacebookSdk.sdkInitialize(getApplicationContext());
    // If you want to use AppEventsLogger to log events.
    AppEventsLogger.activateApp(this);
  }

}

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest version and report back. Thank you for your contributions.

[stale[bot]]

The issue has been closed for inactivity.