Javascript 使用react native Onauth（非函数）验证firebase中的用户

我已经验证了我的用户，我有一个uid。但当我尝试使用Firebase中建议的代码写入数据库时

var isNewUser = true;

var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com");
ref.onAuth(function(authData) {
  if (authData && isNewUser) {
    // save the user's profile into the database so we can list users,
    // use them in Security and Firebase Rules, and show profiles
    ref.child("users").child(authData.uid).set({
      provider: authData.provider,
      name: getName(authData)
    });
  }
});

// find a suitable name based on the meta info given by each provider
function getName(authData) {
  switch(authData.provider) {
     case 'password':
       return authData.password.email.replace(/@.*/, '');
     case 'twitter':
       return authData.twitter.displayName;
     case 'facebook':
       return authData.facebook.displayName;
  }
}

main.js

import React, { Component } from 'react';
'use strict';
import {
  AppRegistry,
  Text,
  StyleSheet,
  ActivityIndicator,
  View,
  Navigator,
} from 'react-native';

import Login from '../login/pages/Login';
import Account from '../login/pages/Account';

import * as firebase from 'firebase';

const firebaseConfig ={
    apiKey: "AIzaSyAaJuCW0nsMLqi-ke6K_bTDhBujilgWneQ",
    authDomain: "test-app-657c0.firebaseapp.com",
    databaseURL: "https://test-app-657c0.firebaseio.com",
    storageBucket: "test-app-657c0.appspot.com",
    messagingSenderId: "215519929651"
  };


const firebaseApp = firebase.initializeApp(firebaseConfig);


import styles from '../login/styles/baseStyles.js';

class Main extends Component {
  constructor(props){
    super(props);
    this.state = {
      // the page is the screen we want to show the user, we will determine that
      // based on what user the firebase apI returns to us.
      page: null
    };
  }

  componentWillMount(){
    // We must asynchronously get the auth state, if we use currentUser here, it'll be null
    const unsubscribe = firebaseApp.auth().onAuthStateChanged((user) => {
      // If the user is logged in take them to the accounts screen
      if (user != null) {
        this.setState({page: Account});
        return;
      }
      // otherwise have them login
      this.setState({page: Login});
      // unsubscribe this observer
      unsubscribe();
    });


  }



  render() {
    if (this.state.page) {
      return (
        // Take the user to whatever page we set the state to.
        // We will use a transition where the new page will slide in from the right.
        <Navigator
          initialRoute={{component: this.state.page}}
          configureScene={() => {
            return Navigator.SceneConfigs.FloatFromRight;
          }}
          renderScene={(route, navigator) => {
            if(route.component){
              // Pass the navigator the the page so it can navigate as well.
              // Pass firebaseApp so it can make calls to firebase.
              return React.createElement(route.component, { navigator, firebaseApp});
            }
        }} />
      );
    } else {
      return (
        // Our default loading view while waiting to hear back from firebase
        <View style={styles.container}>
          <View style={styles.body}>
            <ActivityIndicator size="large" />
          </View>
        </View>
      );
    }
  }
}

module.exports = Main;

import React，{Component}来自'React'；
"严格使用",；
进口{
评估学，
文本，
样式表，
活动指示器，
看法
领航员，
}从“反应本机”；
从“../Login/pages/Login”导入登录名；
从“../login/pages/Account”导入帐户；
从“firebase”导入*作为firebase；
常量firebaseConfig={
apiKey：“AIzaSyAaJuCW0nsMLqi-ke6K_bTDhBujilgWneQ”，
authDomain:“test-app-657c0.firebaseapp.com”，
数据库URL:“https://test-app-657c0.firebaseio.com",
storageBucket:“test-app-657c0.appspot.com”，
messagingSenderId：“215519929651”
};
const firebaseApp=firebase.initializeApp（firebaseConfig）；
从“../login/styles/baseStyles.js”导入样式；
类主扩展组件{
建造师（道具）{
超级（道具）；
此.state={
//页面是我们想要向用户显示的屏幕，我们将确定
//基于firebase apI返回给我们的用户。
页码：空
};
}
组件willmount（）{
//我们必须异步获取身份验证状态，如果我们在这里使用currentUser，它将为null
const unsubscribe=firebaseApp.auth（）.onAuthStateChanged（（用户）=>{
//如果用户已登录，请将其转到帐户屏幕
如果（用户！=null）{
this.setState（{page:Account}）；
返回；
}
//否则让他们登录
this.setState（{page:Login}）；
//取消订阅此观察员
取消订阅（）；
});
}
render（）{
if（this.state.page）{
返回(
//将用户带到我们设置状态的任何页面。
//我们将使用一个过渡，新页面将从右侧滑入。
{
从右侧返回Navigator.sceneconfig.floatfrom；
}}
renderScene={（路线、导航器）=>{
if（路由组件）{
//将导航器传递给页面，使其也可以导航。
//传递firebase应用程序，以便它可以调用firebase。
返回React.createElement（route.component，{navigator，firebaseApp}）；
}
}} />
);
}否则{
返回(
//等待firebase回复时的默认加载视图
);
}
}
}
module.exports=Main；

帐目

'use strict';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableHighlight,
  ToolbarAndroid
} from 'react-native';
import React, {Component} from 'react';
import Login from './Login';
import styles from '../styles/baseStyles.js';

// Styles specific to the account page
const accountStyles = StyleSheet.create({
  email_container: {
    padding: 20
  },
  email_text: {
    fontSize: 18
  }
});

export default class Account extends Component {

  constructor(props) {
    super(props);
    this.state = {
      loading: true,
    }
  }

  componentWillMount() {
    // get the current user from firebase
    const userData = this.props.firebaseApp.auth().currentUser;
    this.setState({
      user: userData,
      loading: false
    });

    console.log(userData);

    console.log(this.props.firebaseApp)

     console.log(this.props.firebaseApp.auth())

      var isNewUser = true;

      var ref = this.props.firebaseApp;
      ref.onAuth(function(authData) {
        if (authData && isNewUser) {
          // save the user's profile into the database so we can list users,
          // use them in Security and Firebase Rules, and show profiles
          ref.child("users").child(authData.uid).set({
            provider: authData.provider,
            name: getName(authData)
          });
        }
      });
      // find a suitable name based on the meta info given by each provider
      function getName(authData) {
        switch(authData.provider) {
           case 'password':
             return authData.password.email.replace(/@.*/, '');
           case 'twitter':
             return authData.twitter.displayName;
           case 'facebook':
             return authData.facebook.displayName;
        }
      }



  }

  render() {
    // If we are loading then we display the indicator, if the account is null and we are not loading
    // Then we display nothing. If the account is not null then we display the account info.
    const content = this.state.loading ? <ActivityIndicator size="large"/> :
       this.state.user &&
        <View style={styles.body}>
          <View style={accountStyles.email_container}>
            <Text style={accountStyles.email_text}>{this.state.user.email}</Text>
          </View>
          <TouchableHighlight onPress={this.logout.bind(this)} style={styles.primaryButton}>
            <Text style={styles.primaryButtonText}>Logout</Text>
          </TouchableHighlight>

          <TouchableHighlight onPress={this.logout.bind(this)} style={styles.primaryButton}>
            <Text style={styles.primaryButtonText}>Logout</Text>
          </TouchableHighlight>
        </View>
      ;
    return (
      <View style={styles.container}>
        <View style={styles.body}>
          {content}
        </View>
      </View>
    );
  }

  logout() {
    // logout, once that is complete, return the user to the login screen.
    this.props.firebaseApp.auth().signOut().then(() => {
      this.props.navigator.push({
        component: Login
      });
    });
  }
}

AppRegistry.registerComponent('Account', () => Account);

“严格使用”；
进口{
评估学，
样式表，
文本，
看法
形象,，
触控高光，
工具栏安卓
}从“反应本机”；
从“React”导入React，{Component}；
从“./Login”导入登录名；
从“../styles/baseStyles.js”导入样式；
//特定于帐户页面的样式
const accountStyles=StyleSheet.create({
电子邮件容器：{
填充：20
},
电子邮件文本：{
尺寸：18
}
});
导出默认类帐户扩展组件{
建造师（道具）{
超级（道具）；
此.state={
加载：对，
}
}
组件willmount（）{
//从firebase获取当前用户
const userData=this.props.firebaseApp.auth（）.currentUser；
这是我的国家({
用户：userData，
加载：错误
});
console.log（userData）；
console.log（this.props.firebaseApp）
console.log（this.props.firebaseApp.auth（））
var isNewUser=true；
var ref=this.props.firebaseApp；
参考onAuth（函数（authData）{
if（authData&&isNewUser）{
//将用户配置文件保存到数据库中，以便我们可以列出用户，
//在安全和Firebase规则中使用它们，并显示配置文件
ref.child（“用户”）.child（authData.uid）.set({
提供程序：authData.provider，
名称：getName（authData）
});
}
});
//根据每个提供者提供的元信息找到合适的名称
函数getName（authData）{
开关（authData.provider）{
案例“密码”：
返回authData.password.email.replace（/@.*/，''）；
“推特”案例：
返回authData.twitter.displayName；
“facebook”案例：
返回authData.facebook.displayName；
}
}
}
render（）{
//如果我们正在加载，那么我们会显示指示器，如果帐户为空，我们不会加载
//然后不显示任何内容。如果帐户不为空，则显示帐户信息。
常量内容=this.state.loading？：
this.state.user&&
{this.state.user.email}
注销
注销
;
返回(
{content}
);
}
注销（）{
//注销完成后，将用户返回登录屏幕。
this.props.firebaseApp.auth（）.signOut（）。然后（（）=>{
这个是.props.navigator.push({
组件：登录
});
});
}
}
AppRegistry.registerComponent（'帐户'，（）=>帐户）；

您遵循哪些文档？已在最新版本的Firebase中弃用。Firebase v3中的等效项为

'use strict';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableHighlight,
  ToolbarAndroid
} from 'react-native';
import React, {Component} from 'react';
import Login from './Login';
import styles from '../styles/baseStyles.js';

// Styles specific to the account page
const accountStyles = StyleSheet.create({
  email_container: {
    padding: 20
  },
  email_text: {
    fontSize: 18
  }
});

export default class Account extends Component {

  constructor(props) {
    super(props);
    this.state = {
      loading: true,
    }
  }

  componentWillMount() {
    // get the current user from firebase
    const userData = this.props.firebaseApp.auth().currentUser;
    this.setState({
      user: userData,
      loading: false
    });

    console.log(userData);

    console.log(this.props.firebaseApp)

     console.log(this.props.firebaseApp.auth())

      var isNewUser = true;

      var ref = this.props.firebaseApp;
      ref.onAuth(function(authData) {
        if (authData && isNewUser) {
          // save the user's profile into the database so we can list users,
          // use them in Security and Firebase Rules, and show profiles
          ref.child("users").child(authData.uid).set({
            provider: authData.provider,
            name: getName(authData)
          });
        }
      });
      // find a suitable name based on the meta info given by each provider
      function getName(authData) {
        switch(authData.provider) {
           case 'password':
             return authData.password.email.replace(/@.*/, '');
           case 'twitter':
             return authData.twitter.displayName;
           case 'facebook':
             return authData.facebook.displayName;
        }
      }



  }

  render() {
    // If we are loading then we display the indicator, if the account is null and we are not loading
    // Then we display nothing. If the account is not null then we display the account info.
    const content = this.state.loading ? <ActivityIndicator size="large"/> :
       this.state.user &&
        <View style={styles.body}>
          <View style={accountStyles.email_container}>
            <Text style={accountStyles.email_text}>{this.state.user.email}</Text>
          </View>
          <TouchableHighlight onPress={this.logout.bind(this)} style={styles.primaryButton}>
            <Text style={styles.primaryButtonText}>Logout</Text>
          </TouchableHighlight>

          <TouchableHighlight onPress={this.logout.bind(this)} style={styles.primaryButton}>
            <Text style={styles.primaryButtonText}>Logout</Text>
          </TouchableHighlight>
        </View>
      ;
    return (
      <View style={styles.container}>
        <View style={styles.body}>
          {content}
        </View>
      </View>
    );
  }

  logout() {
    // logout, once that is complete, return the user to the login screen.
    this.props.firebaseApp.auth().signOut().then(() => {
      this.props.navigator.push({
        component: Login
      });
    });
  }
}

AppRegistry.registerComponent('Account', () => Account);