将FirebaseUI Auth集成在本机中

时间:2017-02-01 05:17:11

标签: ios firebase react-native firebase-authentication

我已经设法(几乎)将FirebaseUI Auth集成到我在iOS中的react-native应用程序中。我可以点击一个react-native按钮,加载firebase auth流,并在登录后发送一个回调到react-native javascript函数。我可以使用firebase用户的UID或refreshToken调用该函数。

尽管如此,我还是试图在反应本机中使用它。是否可以通过仅使用UID或刷新令牌将用户登录到react-native中的firebase?

编辑:添加一些代码,但我确信它可以使用一些与此问题无关的重构:

在ios文件夹中

AppDelegate.m中的

FUIAuth *authUI;
RCTResponseSenderBlock rnOnLogin;

- (void)authUI:(FUIAuth *)authUI didSignInWithUser:(nullable FIRUser *)user error:(nullable NSError *)error {
  // Implement this method to handle signed in user or error if any.
   RCTLogInfo(@"Logged in (app delegate)");
  if (user == NULL) {
    RCTLogInfo(@"Null User");
  } else {
    RCTLogInfo(@"Got User (app delegate)");
    RCTLogInfo(user.uid);
    RCTLogInfo(user.providerData);
    // HERE I CAN PASS INFO ABOUT USER TO REACT NATIVE
    rnOnLogin(@[[NSNull null], user.providerData]);
  }
  if (error != NULL) {
    RCTLogInfo(@"Got Error  (app delegate)");
    RCTLogInfo(error);
  }
}

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
  RCTLogInfo(@"openURL application (app delegate)");
  return [[FUIAuth defaultAuthUI] handleOpenURL:url sourceApplication:sourceApplication];
}
RCTFirebaseAuthUI.m 中的

@implementation RCTFirebaseAuthUI

RCT_EXPORT_MODULE();

UINavigationController *authViewController;
extern FUIAuth *authUI;
extern RCTResponseSenderBlock rnOnLogin;

RCT_EXPORT_METHOD(showLogin:(nonnull RCTResponseSenderBlock )onLogin)
{
  RCTLogInfo(@"showLogin method");

  if(authViewController == nil) {
   authViewController = [authUI authViewController];
   authViewController.delegate = authUI;
  }

  rnOnLogin = onLogin;

  UIWindow *window = [UIApplication sharedApplication].keyWindow;
  UIViewController *rootViewController = window.rootViewController;
  [rootViewController presentViewController:authViewController animated:YES completion:nil];
}

in react native

ProfileScreen.js中的

import * as firebase from 'firebase';

export default class ProfileScreen extends Component {

  logout = () => {
    firebase.auth().signOut()
  }

  setUid = (error, token) => {
    console.log('rn')
    console.log(token)

    // HERE I NEED TO LOGIN THE USER TO REACT NATIVE's FIREBASE
    // firebase.auth().signInWithCredential(token).catch((error) =>
    //  console.log(error)
    //)
  }

  pushLoginScreen = () => {
    var loginUI = NativeModules.FirebaseAuthUI
    loginUI.showLogin(this.setUid)
  }

  constructor(props) {
    super(props);
    this.state = {
      user: null
    };
    firebase.auth().onAuthStateChanged((user) => {
      this.setState({
        user: user
      })
    })
  }

  render() {
    console.log('render profile')
    console.log(this.state.user)
    let user = this.state.user
    if (user !== null) {
      return (
        <View>
           <Text>{user.email}</Text>
        </View>
      )
    } else {
      return (
        <View>
          <Text>Profile</Text>
          <Button title="Login" onPress={this.pushLoginScreen} />
        </View>
      )
    }
  }
}

0 个答案:

没有答案