React - Firebase - GoogleAuthProvider不是構造函數

我正嘗試創建一個使用「使用Google登錄」按鈕來觸發signInWithPopup(provider)的React應用程序。但是，每次我撥打new firebaseApp.auth.GoogleAuthProvider()我的控制檯都會返回一個錯誤。我只是想console.log()result。React - Firebase - GoogleAuthProvider不是構造函數

錯誤： Uncaught TypeError: _firebase_setup2.default.auth.GoogleAuthProvider is not a constructor

這裏是我的代碼

firebase_setup.js

import * as firebase from 'firebase'; 

const firebaseConfig = { 
    apiKey: "AIzaSyAKlWtFZvbvuNy2qC68Xt5xzaTQVyy9l2o", 
    authDomain: "doordash-ff045.firebaseapp.com", 
    databaseURL: "https://doordash-ff045.firebaseio.com", 
    storageBucket: "doordash-ff045.appspot.com", 
}; 

const firebaseApp = firebase.initializeApp(firebaseConfig); 

export default firebaseApp;

login.js

import React, { Component } from 'react'; 

import { browserHistory } from 'react-router'; 
import firebaseApp from '../../../services/firebase_setup'; 

export default class Login extends Component { 

    componentDidMount() { 
    firebaseApp.auth().onAuthStateChanged(user => { 
     if (user) { 
     console.log(user); 
     browserHistory.push('/profile'); 
     } 
    }); 
    } 

    authenticate() { 
    var provider = new firebaseApp.auth.GoogleAuthProvider(); 
    provider.addScope('profile'); 
    provider.addScope('email'); 

    firebaseApp.auth().signInWithPopup(provider) 
     .then(result => { 
     console.log(result); 
     }) 
    } 

    render() { 
    return (
     <div> 
     <h1>Login Page</h1> 
     <button onClick={this.authenticate.bind(this)}> 
      Login with Google 
     </button> 
     </div> 

    ); 
    } 
}

我將不勝感激這個問題！我查了很多教程，但試圖聲明provider變量時總是遇到同樣的錯誤。

來源

2016-09-08 szier

也有類似的問題了一段時間回來，我的問題是因爲使用舊文檔和火力API的最新版本，它不再支持構造'新的Firebase ...' – StackOverMySoul

@Davidlrnt感謝您的快速響應！我正在使用新的文檔。 – szier

'console.log（typeof firebaseApp.auth.GoogleAuthProvider）'作爲線索。 –

您將名稱空間與實例混合使用：firebaseApp只是配置數據的容器。這不是你如何創建一個提供者實例。

正確的方法是：

var provider = new firebase.auth.GoogleAuthProvider();

來源

2016-09-08 18:09:05

工作正常！非常感謝！ – szier

這是否與庫react-native-firebase一起工作？ –

我就遇到了這個「不是一個構造函數」問題和其他一些錯誤也是如此。我在做這樣的事情：

var googleProvider = new myApp.auth.GoogleAuthProvider();

當它應該是

var googleProvider = new firebase.auth.GoogleAuthProvider();

我也初始化我的應用程序有這樣一個名字：

var myApp = firebase.initializeApp(appConfig, "App");

其中未初始化一個默認應用程序&給了我更多的錯誤。我應該這樣做（因爲我只有一個應用程序）

var myApp = firebase.initializeApp(appConfig);

來源

2017-08-25 16:52:26 Trev14

React - Firebase - GoogleAuthProvider不是構造函數

回答

相關問題