Login with Facebook Not Working about react-native-firebase HOT 46 CLOSED

@Salakar @designorant

Followed instructions at https://github.com/invertase/react-native-firebase/blob/master/docs/installation.ios.md by updating my PodFile and ran pod install.

This is what my podfile looks like now:

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'socadv' do
  use_frameworks!
  pod 'GooglePlacePicker', '= 2.0.1'
  pod 'GooglePlaces', '= 2.0.1'
  pod 'GoogleMaps', '= 2.0.1'

  # Pods for socadv

end
source 'https://github.com/CocoaPods/Specs.git'
use_frameworks!
platform :ios, '8.0'

# Required by RNFirebase
pod 'Firebase/Auth'
pod 'Firebase/Analytics'
pod 'Firebase/AppIndexing'
pod 'Firebase/Core'
pod 'Firebase/Crash'
pod 'Firebase/Database'
pod 'Firebase/DynamicLinks'
pod 'Firebase/Messaging'
pod 'Firebase/RemoteConfig'
pod 'Firebase/Storage'
pod 'RNFirebase', :path => '../node_modules/react-native-firebase'

This was the output:

Notice the warning React has been deprecated. Not sure why that came up, but seems ominous.

The Xcode build now fails and I get the following error:

from react-native-firebase.

@AndrewHenderson sorry I couldn't of been more help, i'm just the code monkey that churns out the code here, I get the code, it's the fiddly setup that i'm not 100% familiar with, deffo needs ironing out.

https://github.com/invertase/react-native-firebase-tests/tree/master/src/tests
https://github.com/invertase/react-native-firebase-examples

There's two apps in the org also if you want to check out some of the usage, the tests one has a lot of all the various firebase features being used in tests and the examples app is real-world scenarios etc.

from react-native-firebase.

@AndrewHenderson what are you using to get the accessToken for facebook? And what platform, android or ios?

from react-native-firebase.

@Salakar The React Native Facebook SDK:

import {
  AccessToken
} from 'react-native-fbsdk';
const data = AccessToken.getCurrentAccessToken();
const credential = firebase.auth().FacebookAuthProvider.credential(data.accessToken); // token present on object

…

from react-native-firebase.

@Salakar In my app promise never resolves:

_interceptUserValue(promise) {
  return promise.then((result) => {
    if (!result) return this._onAuthStateChanged(null, false);
    if (result.user) return this._onAuthStateChanged(result, false);
    if (result.uid) return this._onAuthStateChanged({ authenticated: true, user: result }, false);
    return result;
  });
}

promsie is this:

FirebaseAuth.signInWithCredential(credential.provider, credential.token, credential.secret)

See:

from react-native-firebase.

@Salakar The React Native Facebook SDK and ios.

from react-native-firebase.

@Salakar I can screenshare if that would help.

from react-native-firebase.

The example of your fbsdk code doesn't include you logging in; i assume you're doing a button as per https://github.com/facebook/react-native-fbsdk/blob/master/README.md#login-button--access-token and then in the handler calling getCurrentAccessToken?

from react-native-firebase.

On my way home at the moment so can debug when i get home

from react-native-firebase.

The example of your fbsdk code doesn't include you logging, i assume you're doing a button as per https://github.com/facebook/react-native-fbsdk/blob/master/README.md#login-button--access-token and then in the handler calling getCurrentAccessToken?

That's correct. The access token is accessible and being passed to firebase.auth().FacebookAuthProvider.credential

In the library code, FirebaseAuth.signInWithCredential(credential.provider, credential.token, credential.secret) all three arguments are being provided.

from react-native-firebase.

Ok, can you try adding the public_profile and the email scopes to the login button perhaps?

from react-native-firebase.

Also, do you know how to use the xcode deugger? If so can you line break on https://github.com/invertase/react-native-firebase/blob/master/ios/RNFirebase/RNFirebaseAuth.m#L310 and tell me / print screen what the value of credential is?

If you don't then i can look at this over screen share, in a few mins.

from react-native-firebase.

^--- is where you can find the file.

from react-native-firebase.

I'm essentially taking this approach. I'm not sure how to add scopes to the button.

const FBSDK = require('react-native-fbsdk');
const {
  LoginButton,
  AccessToken
} = FBSDK;

var Login = React.createClass({
  render: function() {
    return (
      <View>
        <LoginButton
          onLoginFinished={
            (error, result) => {
              if (error) {
                alert("login has error: " + result.error);
              } else if (result.isCancelled) {
                alert("login is cancelled.");
              } else {
                AccessToken.getCurrentAccessToken().then(
                  (data) => {
                    alert(data.accessToken.toString())
                  }
                )
              }
            }
          }
          onLogoutFinished={() => alert("logout.")}/>
      </View>
    );
  }
});

from react-native-firebase.

https://github.com/facebook/react-native-fbsdk/blob/master/js/FBLoginButton.js#L56

Add that as an array prop to your component, and add the two scopes as above

from react-native-firebase.

Also, do you know how to use the xcode deugger

I thought so. I set a breakpoint in Xcode but it's not hitting. My folder structure looks different. I have the project in Libraries:

from react-native-firebase.

Does it even get into that function? If it does try break here: https://github.com/invertase/react-native-firebase/blob/master/ios/RNFirebase/RNFirebaseAuth.m#L450 . does it get there?

from react-native-firebase.

OK after adding readPermissions array, I hit the breakpoint in Xcode.

Is this what you're referring to <FIRFacebookAuthCredential: 0x60800042f4a0>?

from react-native-firebase.

OK, try without the breakpoints now, leave the readPermission array in there. Seems like its working now?

from react-native-firebase.

It's not because neither of these breakpoints ever hit:

from react-native-firebase.

Ah, is it hitting the reject in the if statement above?

from react-native-firebase.

No, it's not nil, so continues but never makes it to the if statement inside:

[[FIRAuth auth] signInWithCredential:credential completion:^(FIRUser *user, NSError *error) {

from react-native-firebase.

Does this look right?

It looks like the issue is there. We never enter the callback.

from react-native-firebase.

The code is correct, can you try re-start your emulator, might be an emulator network issue, should deffo get into that callback =/

from react-native-firebase.

I'm getting the same issue with creating a user via email. This breakpoint never hits.

Something must be wrong with my install then.

I tried restarting the simulator. No luck. I used the docs to install. Perhaps the steps were incorrect.

I didn't see any mention of react-native link react-native-firebase, but I ran that.

from react-native-firebase.

Should RNFirebase be in my Pods directory? Does it matter that it's in my Libraries directory?

from react-native-firebase.

Ye its your simulator, network issues, stop it and reboot the emulator, the email sign in tests are all passing on ios and android emulator here:

from react-native-firebase.

Your emulator would be redboxing if it wasn't required properly

from react-native-firebase.

@Salakar by emulator do you mean simulator? I've restarted Xcode and iOS simulator. I've closed and rebooted the React Packager to no avail.

from react-native-firebase.

Maybe it has something to do with my Pods. This is my PodFile:

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'MyApp' do
  use_frameworks!
  pod 'GooglePlacePicker', '= 2.0.1'
  pod 'GooglePlaces', '= 2.0.1'
  pod 'GoogleMaps', '= 2.0.1'

  # Pods for MyApp

end
source 'https://github.com/CocoaPods/Specs.git'
use_frameworks!
platform :ios, '8.0'

[
  'Firebase',
  'Firebase/Core',
  'Firebase/Auth',
  'Firebase/Storage',
  'Firebase/Database',
  'Firebase/RemoteConfig',
  'Firebase/Messaging',
  'Firebase/Analytics',
].each do |lib|
  pod lib
end

from react-native-firebase.

@chrisbianca can you see anything wrong here? I'm stumped, seems like all the auth methods on firebase are hanging and not getting into the ios completion callbacks?

from react-native-firebase.

@AndrewHenderson This is just a guess but I've noticed you still have Firestack in your libraries so maybe there are some leftovers that cause this behaviour? It's unlikely the reason but I've seen some XCode voodoo in the past.

from react-native-firebase.

@Salakar Screenshare? I'd eager to get this resolved. I'd like to migrate to this library from Firestack.

from react-native-firebase.

@designorant I'll take a look.

from react-native-firebase.

@AndrewHenderson do you have screen hero? PM me your email on gitter or discord if you do, can screen share

from react-native-firebase.

@Salakar @designorant

I removed any reference to Firestack from my codebase. I'm getting the following error in Xcode console:

<Error> [Firebase/Core][I-COR000003] The default Firebase app has not yet been configured. Add [FIRApp configure] to your application initialization. Read more: https://goo.gl/ctyzm8.

I did execute new RNFirebase(configOptions) in my JavaScript. Is there something else I have to do in Xcode files?

from react-native-firebase.

@AndrewHenderson #10 (comment) ?

from react-native-firebase.

Was added to the docs too: https://github.com/invertase/react-native-firebase/blob/master/docs/installation.ios.md . at the bottom, if it helps

from react-native-firebase.

Should these header search paths be recursive?

from react-native-firebase.

Someone mentioned on gitter a while back there was an issue with the rnpm link and header paths:

If thats of any help?

from react-native-firebase.

it was @designorant as above, what did you do to fix it?

from react-native-firebase.

I removed pod 'RNFirebase', :path => '../node_modules/react-native-firebase'

Which resulted in React not being installed as a Pod. See below:

I think that line was causing a recursion issue with the frameworks.

The project now builds and it appears as though I'm authenticated through Firebase.

I'll report back once I get my JS back to a stable state.

from react-native-firebase.

I think @chrisbianca installed via the pod and updated docs accordingly as he had no issues there, maybe the docs need a revisit then / these kind of things adding.

Getting it all installed was the hardest part though :) the rest should be a breeze from now on, the migration guide from firestack is basically do what the firebase web sdk does, so things like snapshot.value become snapshot.val() and so on.

This additionally has storage, analytics, transactions and a full fcm implementation compared to firestack.

from react-native-firebase.

@Salakar Thanks for your help!

from react-native-firebase.

In terms of header paths the issue I had was that RNPM was joining the string paths instead of putting them into arrays which in turn caused XCode to moan (compare top and bottom examples on that screenshot to see the difference). I fixed the messed up lines manually, in a text editor.

In terms of the recent iOS installation changes, I've just left a comment on the commit as I've just found out I can't get my RN project to start with the recent Podfile changes. Getting rid of pod 'RNFirebase' makes everything fine but I've had previous RNFirebase linked the 'old' way.

I don't think it's the same issue as @AndrewHenderson's but I'm leaving this here for any wanderers out there.

from react-native-firebase.

Just as a follow up, I've updated the docs to give setup options based on how your project is currently setup. If you're already using a Podfile with React Native installed as a pod then adding RNFirebase as a pod is by far the simplest way to go. Otherwise, you can use react-native link or a manual set up, depending on what you'd prefer.

from react-native-firebase.