Firebase GoogleAuthProvider在本地

时间:2019-04-08 16:12:27

标签: react-native

我在我的项目中使用react-native-firebase,因为我在正式文档中读到了使用该函数的功能“ new firebase.auth.GoogleAuthProvider()”,但是当我使用此函数时,它会抛出一个错误本机Firebase SDK不支持“ new GoogleAuthProvider”。 我想使用Firebase使用Google登录。有帮助吗?

1。)android / build.grade

dependencies {
    classpath 'com.android.tools.build:gradle:3.3.1'
    classpath 'com.google.gms:google-services:4.0.1'
  }

2。)android / app / build.gradle

dependencies {
    implementation project(':react-native-firebase')

    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat- v7:${r ootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From    node_modules
    implementation 'com.google.firebase:firebase-core:16.0.1'
    implementation 'com.google.firebase:firebase-auth:16.2.1'
    implementation 'com.google.android.gms:play-services-  auth:16.0.1'

// implementation 'com.google.firebase:firebase-auth:16.1.0'
   }

3。)MainApplication.java

      package com.my_firebase;

      import android.app.Application;

      import com.facebook.react.ReactApplication;
      import io.invertase.firebase.RNFirebasePackage;
      import com.facebook.react.ReactNativeHost;
      import com.facebook.react.ReactPackage;
      import com.facebook.react.shell.MainReactPackage;
      import com.facebook.soloader.SoLoader;
      import io.invertase.firebase.auth.RNFirebaseAuthPackage;
      import java.util.Arrays;
      import java.util.List;

      public class MainApplication extends Application implements ReactApplication {

      private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
        @Override
        public boolean getUseDeveloperSupport() {
          return BuildConfig.DEBUG;
        }

        @Override
        protected List<ReactPackage> getPackages() {
          return Arrays.<ReactPackage>asList(
              new MainReactPackage(),
                new RNFirebasePackage(),
                new RNFirebaseAuthPackage()
          );
        }

        @Override
        protected String getJSMainModuleName() {
          return "index";
        }
      };

      @Override
      public ReactNativeHost getReactNativeHost() {
        return mReactNativeHost;
      }

      @Override
      public void onCreate() {
        super.onCreate();
        SoLoader.init(this, /* native exopackage */ false);
      }
      }

4。)App.js

       /**
   * Sample React Native App
   * https://github.com/facebook/react-native
   *
   * @format
   * @flow
   */

  import React, {Component} from 'react';
  import {Platform, StyleSheet, Text, View , Button} from 'react-native';
  import firebase from 'react-native-firebase';

  const instructions = Platform.select({
    ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
    android:
      'Double tap R on your keyboard to reload,\n' +
      'Shake or press menu button for dev menu',
  });

  export default class App extends Component {

    componentWillMount(){
      var config = {
        apiKey: "AIzaSyByT-vf-7LBi0xFs_KsSTryLTc1iAWhm28",
        authDomain: "authentication-b89a8.firebaseapp.com",
        databaseURL: "https://authentication-b89a8.firebaseio.com",
        projectId: "authentication-b89a8",
        appId: "com.rahul.authentication",
        storageBucket: "authentication-b89a8.appspot.com",
        messagingSenderId: "600278637960"
      };
      firebase.initializeApp(config);
    }

    state = { email: '', password: '', errorMessage: null }

    handleSignUp = () => {
      var provider = new firebase.auth.GoogleAuthProvider();
  alert(provider);

    }
    render() {
      return (
        <View style={styles.container}>
          <Text style={styles.welcome}>Welcome to React Native!</Text>
          <Text style={styles.instructions}>To get started, edit App.js</Text>
          <Text style={styles.instructions}>{instructions}</Text>
          <Button title="SignIn" onPress={this.handleSignUp}>Signin</Button>
        </View>
      );
    }
  }

  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
      backgroundColor: '#F5FCFF',
    },
    welcome: {
      fontSize: 20,
      textAlign: 'center',
      margin: 10,
    },
    instructions: {
      textAlign: 'center',
      color: '#333333',
      marginBottom: 5,
    },
  });[![enter image description here][1]][1]

1 个答案:

答案 0 :(得分:0)

当您看到react-native-firebase文档时,他们建议使用库'react-native-google-signin':https://rnfirebase.io/docs/v5.x.x/auth/social-auth

您有一个代码段,必须在handleSignUp函数中使用该代码段:

// Calling this function will open Google for login.
export async function googleLogin() {
  try {
    // add any configuration settings here:
    await GoogleSignin.configure();

    const data = await GoogleSignin.signIn();

    // create a new firebase credential with the token
    const credential = firebase.auth.GoogleAuthProvider.credential(data.idToken, data.accessToken)
    // login with credential
    const firebaseUserCredential = await firebase.auth().signInWithCredential(credential);

    console.warn(JSON.stringify(firebaseUserCredential.user.toJSON()));
  } catch (e) {
    console.error(e);
  }
}