The identity provider configuration is not found - React Native Firebase Authentication with FacebookAuthProvider

honor picture honor · Apr 4, 2019 · Viewed 9.2k times · Source

The identity provider configuration is not found

I am getting this error when I try to authenticate to firebase using FacebookAuthProvider. I am using react-native-fbsdk for facebook authentication integration with react-native. my aim is to login the user ti firebase with the authentication token and record the user data in USERS collection inside firestore.

Below is my code. Any help is appreciated.!

fbAuth(){
        LoginManager.logInWithReadPermissions(['public_profile','email','user_photos']).then(
            (result)=>{
                this.handleCallBack(result),
                function(error){
                    console.log("error in facebook login.");
                }
            }
        );
    }
    handleCallBack(result){
        var _this = this;
        if(result.isCancelled){
            console.log("facebook login cancelled.");
        }else{
            AccessToken.getCurrentAccessToken().then(
                (data) => {
                    const token = data.accessToken;
                    fetch('https://graph.facebook.com/v2.8/me?fields=id,first_name,last_name,gender,birthday&access_token=' + token)
                    .then((response=>response.json()))
                    .then((json)=>{
                        const imageSize = 120;
                        const facebookID = json.id;
                        const fbImage = "https://graph.facebook.com/${facebookID}/picture?height=${imageSize}";
                    })
                    this.authenticate(data.accessToken)
                    .then(result =>{
                        const {uid} =  result;
                        _this.createUser(uid,json,token,fbImage);
                    })
            })
            .catch(error=>{
                    console.log(error);
            })   
        } 
    }
    authenticate = (token) => {
        const provider = firebase.auth.FacebookAuthProvider;
        const credential = provider.credential(token);
        var ret = firebase.auth().signInWithCredential(credential);
        return ret;
    }
    createUser = (uid,userData,token,dp) => {
        const defaults = {
          uid,
          token,
          dp,
          ageRange: [20, 30]
        }
        const db = firebase.firestore();
        db.settings({timestampsInSnapshots:true});
        db.collection('USERS').add({
            ...userData, ...defaults,
            fsTimestamp: firebase.firestore.Timestamp.now()
        })
        .then(()=>{
            console.log("User recorded.");
                //this.clearState();
        })
        .catch((error)=>{console.log(error)});
     }

Here are my imports:

import * as firebase from 'firebase';
import 'firebase/firestore';
import {LoginManager,LoginButton,AccessToken,GraphRequest,GraphRequestManager} from 'react-native-fbsdk';

Answer

honor picture honor · Apr 5, 2019

I found it. The problem was not about the code. It was actually something very fundamental :) The thing is I had not enabled the facebook sign-n provider inside sign-in providers section on the firebase side. You should enable this authentication method if you are seeing the same problem.

sign-in providers screen