Autenticación de Firebase con Google

Hola. Espero le sirva a alguien de ayuda.
En la parte donde esta “await .signInWithCredential”, no retorna un objeto FirebaseUser sino un objeto AuthResult, del cual pueden obtener un FirebaseUser.

Aquí les comparto el código que me funcionó:

AuthResult authResult = await _auth.signInWithCredential(
      GoogleAuthProvider.getCredential(idToken: googleAuth.idToken, accessToken: googleAuth.accessToken)
    );

   FirebaseUser user = await authResult.user;

También si les interesa, pueden hacer login con Facebook de esta manera:

Future<FirebaseUser> facebookSignIn() async{
    final result = await _facebookLogin.logInWithReadPermissions(['email']);

    switch (result.status) {
      case FacebookLoginStatus.loggedIn:{
        AuthResult authResult = await _auth.signInWithCredential(
          FacebookAuthProvider.getCredential(accessToken: result.accessToken.token)
        );
        
        FirebaseUser user = authResult.user;

        return user;
        break;
      }
        
      case FacebookLoginStatus.cancelledByUser:{
        print("cancelado por usuario");
        break;
      }
        
      case FacebookLoginStatus.error:{
        print("Error: "+result.errorMessage.toString());
        break;
      }
    }
  }

o también con Correo y Contraseña:

Future<FirebaseUser> emailAndPasswordSignIn(String email, String password) async{
    AuthResult authResult = await _auth.signInWithEmailAndPassword(email: email, password: password);

    FirebaseUser user = authResult.user;

    return user;
  }

La clase FirebaseUser está obsoleta en la versión 0.18.0+1, por lo que recomienda como ya lo han mencionado algunos, usar un alias para firebas_auth. El signInWithCredential retorna un UserCredential y este objeto contiene el user dentro, el código actualizado queda así:

import 'package:firebase_auth/firebase_auth.dart' as auth;
import 'package:google_sign_in/google_sign_in.dart';

class FirebaseAuthAPI {
  final auth.FirebaseAuth _auth = auth.FirebaseAuth.instance;
  final GoogleSignIn googleSignIn = GoogleSignIn();

  Future<auth.User> signIn() async {
    GoogleSignInAccount googleSignInAccount = await googleSignIn.signIn();
    GoogleSignInAuthentication gSA = await googleSignInAccount.authentication;

    auth.UserCredential userCredential = await _auth.signInWithCredential(
        auth.GoogleAuthProvider.credential(
            idToken: gSA.idToken, accessToken: gSA.accessToken));

    return userCredential.user;
  }
}

Espero

Hola a todos, les dejo el link al tutorial que hice sobre esta clase, con el código actualizado a Marzo del 2021. Es el mismo código pero usando los métodos e instancias de las librerías actualizados:

Tutorial clase 14

firebase_auth_api.dart actualizado al 7/nov/2021

import 'package:firebase_auth/firebase_auth.dart';
import 'package:google_sign_in/google_sign_in.dart';

class FirebaseAuthAPI {
  final FirebaseAuth _auth = FirebaseAuth.instance;
  final GoogleSignIn googleSignIn = GoogleSignIn();

  Future<UserCredential> signInWithGoogle() async {
    // Trigger the authentication flow
    final GoogleSignInAccount? googleUser = await googleSignIn.signIn();

    // Obtain the auth details from the request
    final GoogleSignInAuthentication? googleAuth = await googleUser?.authentication;

    // Create a new credential
    final user = await _auth.signInWithCredential(GoogleAuthProvider.credential(
      accessToken: googleAuth?.accessToken,
      idToken: googleAuth?.idToken,
    ));

    // Once signed in, return the UserCredential
    return user;
  }
}

En este punto hay muchos conceptos que deberían ser aclarados para entender claramente lo que estamos haciendo. Creo que es necesario entender entre otros operaciones sincrónicas y asíncronas, streams y silks y el concepto de Futures. Afortunadamente la documentación en dart está bastante bien (https://dart.dev/codelabs/async-await) y hay un par de videos en youtube que apoyan el concepto.

En vez de renombrar la clase creada se puede identificar a la clase importada de distinta manera con ‘as’:

import 'package:firebase_auth/firebase_auth.dart' as auth;
import 'package:google_sign_in/google_sign_in.dart';

class FirebaseAuth {
  auth.FirebaseAuth _auth = auth.FirebaseAuth.instance;
}

Creo que deberían actualizar los videos, en este, parte del código es obsoleta (ya no sirve), además deberían aclarar varios puntos que se usan y no se explican, como por ejemplo el funcionamiento del Future, no es claro qué hace y para qué sirve.

De todas formas investigando por aparte lo ajusté de la siguiente manera:

import 'package:google_sign_in/google_sign_in.dart';
import 'package:firebase_auth/firebase_auth.dart';

class FirebaseAuthAPI {
  final FirebaseAuth _auth = FirebaseAuth.instance;
  final GoogleSignIn googleSignIn = GoogleSignIn();

  Future<User> signIn() async {
    GoogleSignInAccount googleSignInAccount = await googleSignIn.signIn();
    GoogleSignInAuthentication gSA = await googleSignInAccount.authentication;

    UserCredential userCredential = await _auth.signInWithCredential(
        GoogleAuthProvider.credential(
            idToken: gSA.idToken, accessToken: gSA.accessToken));

    return userCredential.user;
  }
} 

Aunque creo que esto debería hacerlo la tutora del curso

Hola, por si les sirve para seguir avanzando en el curso:

En file firebase_auth_api.dart deprecaron algunas funciones, a mi me sirvió así

Future<UserCredential> signIn() async{
    GoogleSignInAccount googleSignInAccount = await googleSignIn.signIn();
    GoogleSignInAuthentication gSA = await googleSignInAccount.authentication;

    final GoogleAuthCredential googleCredential = GoogleAuthProvider.credential(
      accessToken: gSA.accessToken,
      idToken: gSA.idToken,
    );
    
    final UserCredential googleUserCredential = await FirebaseAuth.instance.signInWithCredential(googleCredential);
    return googleUserCredential;    
  }

En file auth_repository.dart también se debe cambiar

Future<UserCredential> signInFirebase() => _firebaseAuthAPI.signIn();

Hola, si alguien no sabe qué es eso de los futuros se le hará más complicado conforme avance el curso.
Algo que me ayudó fue este artículo que dejo abajo. En mi opinión este artículo es ideal para entender lo que se verá en las próximas clases, así que no está demás echarle un ojo. 😃
https://medium.com/comunidad-flutter/futuros-de-dart-flutter-en-el-foco-24c3f8399e35

En la doc actualizada, te da una guia de esto:
https://firebase.flutter.dev/docs/auth/social

Curso muy desactualizado!

A la fecha se ha implementado el Null Safety en dart, por lo que les dejo el código actualizado.

import 'package:firebase_auth/firebase_auth.dart';
import 'package:google_sign_in/google_sign_in.dart';

class FirebaseAuthAPI {
  final FirebaseAuth auth = FirebaseAuth.instance;
  final GoogleSignIn googleSignIn = GoogleSignIn();

  Future<UserCredential> signIn() async {
    GoogleSignInAccount? googleSignInAccount = await googleSignIn.signIn();
    GoogleSignInAuthentication? gSA = await googleSignInAccount!.authentication;
    
    UserCredential user = await auth.signInWithCredential(
      GoogleAuthProvider.credential(
          idToken: gSA.idToken, accessToken: gSA.accessToken),
    );
    return user;
  }
}

Hola a todos, espero estén full [email protected], creo que no soy el único que tiene problemas con el curso en este punto, esto debido a la nueva actualización de flutter y el Null safety, bueno a continuación les voy a compartir mi codigo, tanto del pubspec.yaml como de los archivos dart, espero les sea de ayuda.

dependencias en pubspec.yaml

firebase_core: ^1.6.0
  firebase_analytics: ^8.3.1
  google_sign_in: ^5.0.7
  firebase_storage: ^10.0.3
  firebase_auth: ^3.1.0
  cloud_firestore: ^2.5.1
  firebase_database: ^7.2.1

firebase_auth.dart

import 'package:google_sign_in/google_sign_in.dart';
import 'package:firebase_auth/firebase_auth.dart';

class FirebaseAuthAPI {
  final FirebaseAuth _auth = FirebaseAuth.instance;
  static GoogleSignIn googleSignIn = GoogleSignIn(
    scopes: ['email'],
  );

  Future<User?> signIn() async {
    GoogleSignInAccount? account = await googleSignIn.signIn();
    GoogleSignInAuthentication gSA = await account!.authentication;

    UserCredential userCredential = await _auth.signInWithCredential(
        GoogleAuthProvider.credential(
            idToken: gSA.idToken, accessToken: gSA.accessToken));

    return userCredential.user;
  }
}

No se si se me escapa algo, de ser así, avísenme y edito el comentario, hay mas cosas que tuve que corregir del curso, porque esta desactualizado, si varios necesitan ayuda, hago un video en youtube para ayudar.

Saludos desde colombia!

Estoy realizando el curso en abril 2021 y esta demasiado desactualizado respecto a las librerías de Firebase deberían actualizarlo, tomen en cuenta por fa 😃

Aun que ya hay varios compañeros que identificarón como solucionar la parte del FirebaseUser ( que esta deprecado) creo que se deberia actualizar el video. Tampoco tiene mucho sentido llamar a una clase API a algo que no es una API.

En mi opinión, no tiene mucho sentido crear AuthRepository y FirebaseAuthAPI si no vas a ocultar su implementación. Estamos acoplando la vista al modelo FirebaseUser, un modelo que no depende de nosotros. Un mejor approach es usar un model User que contenga datos básicos como nombre, teléfono, email, url de la foto. Datos que podes encontrar en diferentes métodos de login que tengamos. Mi propuesta es desacoplarnos de FirebaseUser de la siguiente forma

class AuthRepository {
  final _firebaseAuth = FirebaseRepositoryAPI();

  Future<User> signInFirebase() async {
    FirebaseUser user = await _firebaseAuth.signIn();
    User _user = User(user.displayName, user.email, user.phoneNumber, user.photoUrl);
    return _user;
  }
}```

Esto nos permitirá agregar un nuevo modo de SignIn como Facebook y retornar un objeto User a la vista. De esta forma a la vista no le interesa como hizo login y podremos acceder siempre a su nombre, independientemente del método usado

Aquí no importa si el nombre de archivo esta con mayusculas?

Como le tendria que hacer para que desde mi widget de mi screen, acceda a alguna otra autenticación, osea se que estan los nombres de mis metodos, pero actualmente se tiene la siguiente jerarquia

screen_widget -> bloc -> auth_repository -> firebase_auth_api

Por lo que entiendo, la idea de tener todo de esta forma es: "Desde el widget hacer algo como userBloc.signIn()

y esto, hara el viaje, hasta firebase_auth_api y seleccionará el tipo de logueo, ej. google, fb, anonimo, etc.

Lo que a mi se me ocurre, es que cuando se hace el llamado, pasar por parametro el tipo de login, ej. userBloc.signIn(‘google’) o userBloc.signIn(‘anon’), e ir pasando los parametros desde el screen_widget -> bloc -> auth_repository -> firebase_auth_api, pero creo que esto es algo engorroso, la verdad preferiria llamar el metodo desde el widget directo de firebase_auth_api

No se si alguien puede orientarme con esta parte, se lo agradeceria de antemano

Que tal compañeros, agrego mi aporte. supongo que por la version en la cual se estaba trabajando anteriormente, el código para la clase firebase_auth_api no me funcionaba a si que revisando la documentación de flutter pude solucionar mi inconveniente. les adjunto el código.

Empecé muy entusiasmado con el curso creyendo que iba a ser más sencillo, y he estado luchando para que mi APP corra hasta este vídeo, pero la desactualización del curso lo hace MUY DIFICIL, creo que los administradores de Platzi deben hacer un alto aquí y revisar que se puede hacer para mejorar esto, por el momento estoy fuera del curso, seguiré aprendiendo por mi cuenta desde otras fuentes.

Proceso guardar login con google en firebase

También pueden ver un tutorial más actualizado aquí:
https://youtu.be/oyVDDRczuJI

Si a alguien le sale este error

FirebaseException ([core/no-app] No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp())

Lo puede solucionar siguiendo este corto tutorial
https://www.youtube.com/watch?v=y1763PWQ0JM

Hola les comparto una pequeña actualización:

import 'package:firebase_auth/firebase_auth.dart' as auth;
import 'package:google_sign_in/google_sign_in.dart';

class FirebaseAuthAPI {
  final auth.FirebaseAuth _auth = auth.FirebaseAuth.instance;
  final GoogleSignIn googleSignIn = GoogleSignIn();

    Future<auth.User?> signIn() async {
    GoogleSignInAccount? googleSignInAccount = await googleSignIn.signIn();
    GoogleSignInAuthentication gSA = await googleSignInAccount!.authentication;

    auth.UserCredential userCredential = await _auth.signInWithCredential(
        auth.GoogleAuthProvider.credential(
            idToken: gSA.idToken, accessToken: gSA.accessToken));

    return userCredential.user;
  }
}

En cada lugar donde mencione FirebaseUser en la version actual solo hay que poner User

La librería de google sign in ha cambiado un poco, pero facilmente pueden guiarse de este tutorial https://firebase.flutter.dev/docs/auth/social para implementar el metodo signIn

Que es paralelización?

Empezando la autenticaciòn

Muy claro todo

Muy buena la clase!

¿Alguien sabe cómo implementar la opción serverClientId para devolver serverAuthCode en Flutter?

En android se hace con el siguiente procedimiento: https://developers.google.com/identity/sign-in/android/backend-auth Provee con el código:

final FirebaseAuth _auth = FirebaseAuth.instance;
final GoogleSignIn googleSignIn = GoogleSignIn (
serverClientId: serverClientId,);

Pero marca este error: E / flutter (5143): [ERROR: flutter / lib / ui / ui_dart_state.cc (157)] Excepción no controlada: PlatformException (excepción, dos ID de cliente de servidor diferentes proporcionados, nulo)

Mi aporte:
Email authentication.
.

Future<FirebaseUser> signInWithEmail(String email, String password) async{
    AuthResult authResult = await _auth.signInWithCredential(
      EmailAuthProvider.getCredential(email: email, password: password)
    );
    
    FirebaseUser user = authResult.user;
    return user;
  }

No puede realizar el inicio de sesión usando provider, sin embargo de tanto buscar, resulta que existe actualizaciones de los paquetes, por tanto ahora hay que envolver a la app con un método asyn… No soy bueno usando términos pero les dejo el link de un video reciente y el repositorio…

https://www.youtube.com/watch?v=s0TlqY5ePQU&t=528s
https://github.com/lohanidamodar/fl_fire_auth

Genial! estoy viendo en los comentarios nuevas formas de autenticación. Primero intentaré con esta 😉