React Context + Firebase Auth 未填充 onAuthStateChanged

Question

我已經為此苦苦掙扎了一段時間。 我下面的上下文提供程序沒有觸發任何 onAuthStateChanged 更改 - 即它沒有填充用戶，即使他們已登錄。

AuthProvider.js

import React, { createContext, useState, useEffect } from 'react';
import { firebaseAuth } from '../firebase/firebase';

export const AuthContext = createContext({ loggedIn: false });

const AuthProvider = props => {
  const [user, setUser] = useState({ loggedIn: false, email: null });

  useEffect(() => {
    const unsubscribe = firebaseAuth.onAuthStateChanged(user => {
      console.log(user); // Fires once "null"
      console.log(firebaseAuth.currentUser); // Fires once "null"
      if (user) {
        console.log('logged in');
        setUser({ loggedIn: true, email: user.email });
      } else {
        console.log('not logged in'); // Fires once
        setUser({ loggedIn: false });
      }
    });
    return () => {
      unsubscribe();
    }
  }, []);

  return (
    <AuthContext.Provider value={user}>
      {props.children}
    </AuthContext.Provider>
  );
};

export default AuthProvider;

firebase/firebase.js

import firebase from 'firebase/app';
import 'firebase/analytics';
import 'firebase/auth';
import 'firebase/firebase-firestore';

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID,
  measurementId: process.env.REACT_APP_FIREABSE_MEASUREMENT_ID
};

const firebaseApp = firebase.initializeApp(firebaseConfig);
firebase.analytics();
export const firebaseAuth = firebase.auth();

export default firebaseApp;

App.js

import React from 'react';
import AuthProvider from './providers/AuthProvider';
import Routes from './components/Routes';
import './App.scss';

const App = () => {
  return (
    <AuthProvider>
      <Routes />
    </AuthProvider>
  );
}

export default App;

如上所述，我從 AuthProvider.js - null、null 和“未登錄”獲得控制台 output 一次。

誰能指出我在登錄時為什么沒有填充我的用戶的正確方向？ 謝謝！

Answer 1

問題似乎出在我的 UI 配置中。 我有signInSuccessUrl: '/' 。 一旦我刪除它，它就起作用了。