CODEWITHSUNDEEP
javascriptreactjsfirebasereact-admin
dolki
dolki

Reputation: 93

Firebase Auth with GoogleAuthProvider

I've been following this tutorial to implement firebase googleAuth in my react admin project.

I'm able to login to my app, and logout. That all works, but i'm having trouble with how I can see the tokenID that google is sending to verify my login. I need this information to verify with an eventual backend. Here is what my Login form looks like currently.

import React from "react";
import { Login, LoginForm } from "react-admin";
import StyledFirebaseAuth from 'react-firebaseui/StyledFirebaseAuth';
import firebase from 'firebase';

// Configure FirebaseUI.
const uiConfig = {
  // Popup signin flow rather than redirect flow.
  signInFlow: 'popup',
  // Redirect to /signedIn after sign in is successful. Alternatively you can provide a callbacks.signInSuccess function.
  signInSuccessUrl: '#/',
  // We will display Google as the auth provider.
  signInOptions: [
    firebase.auth.GoogleAuthProvider.PROVIDER_ID
  ]
};

const SignInScreen = () => <StyledFirebaseAuth uiConfig={uiConfig} firebaseAuth={firebase.auth()}/>;

const CustomLoginForm = props => (
  <div>
    <LoginForm {...props} />
    <SignInScreen />
  </div>
);

const CustomLoginPage = props => (
  <Login {...props}>
    <CustomLoginForm {...props}/>
  </Login>
);

export default CustomLoginPage;

Any idea how I can draw out this information, like id, name, email etc, from this flow?

Thanks in advance

Upvotes: 1

Views: 625

Answers (1)

dolki
dolki

Reputation: 93

Welp, spent 4 hours yesterday to no avail. Post this and 15 mins later find my own answer. If you add this call back to the uiConfig, you can log out the credential information and from there, do what you want with it.

  callbacks: {
    signInSuccessWithAuthResult: function(authResult, redirectUrl) {
       console.log(authResult)
    },
  },

Upvotes: 1

Related Questions