Android — Firebase Authentication (1)
En el primer artículo que escribí sobre el “nuevo” Firebase, vimos que para desarrollar el ejemplo tuvimos que desactivar la seguridad de la base de datos para poder almacenar datos de forma anónima. Y es que, en el nuevo Firebase, la autenticación viene activada por defecto.
Te invito a leer mis artículos anteriores sobre Firebase.
En este artículo hablaré de este importante feature que trae Firebase.
Para empezar es importante resaltar que existen dos caminos para la implementación del mecanismo de Autenticación en nuestra aplicación:
- Autenticación vía Firebase UI: Firebase UI es una biblioteca open-source que trae consigo componentes visuales listos para usar a fin de implementar el inicio de sesión de nuestra aplicación de una manera rápida.
- Autenticación vía Firebase SDK: Cuando requerimos desarrollar componentes personalizados y manejar o hacer operaciones adicionales durante el inicio de sesión podremos hacer uso del SDK directamente.
En este artículo vamos a ver cómo implementar la primera vía.
Paso 1: Configurar los métodos de inicio de sesión para nuestra aplicación
Esto lo conseguiremos habilitando los inicios de sesión en la consola de Firebase, como podrán apreciar en las siguientes imágenes.
Para este ejemplo estoy habilitando como proveedores las opciones Email/Password y Google (también habilité el proveedor para Twitter, pero eso lo veremos en el siguiente artículo).
Vale mencionar que para que nuestra aplicación Android deberemos registrar la llave correspondiente como lo hicimos en el primer artículo. Y para poder emplear Twitter requeriremos tanto la correspondiente API key y API secret.
Paso 2: Customizar la interfaz de inicio de sesión
Primero debemos agregar la dependencia para poder trabajar con FirebaseUI.
dependencies {
// ...
compile 'com.firebaseui:firebase-ui-auth:0.4.1'
}Debido a que nuestra aplicación ya la habíamos registrado en la consola (esto lo mostré en el primer artículo) el archivo google-services.json ya se encuentra presente en nuestro proyecto y por lo tanto, la configuración básica ya está efectuada.
A continuación, deberemos crear un Activity similar al que pueden apreciar a continuación.
La magia para la creación de la interfaz de inicio sesión ocurre en esta porción de código:
startActivityForResult(
AuthUI.getInstance()
.createSignInIntentBuilder()
.setLogo(R.drawable.logo_devpicon)
.setProviders(
AuthUI.EMAIL_PROVIDER,
AuthUI.GOOGLE_PROVIDER)
.build(),
RC_SIGN_IN);La clase AuthUI es el punto de entrada para el flujo de autenticación que nos provee FirebaseUI, mediante la invocación de la función createSignInIntentBuilder internamente se construirá una interfaz de acuerdo a los parámetros que le enviemos. Para este ejemplo, estoy estableciendo un logo e indicando que deberá customizar la pantalla para soportar el inicio de sesión mediante correo electrónico y mediante nuestra cuenta de Google. También podría customizar los colores mediante la aplicación de un tema.
Vale mencionar que por defecto si no le enviáramos proveedor alguno, nos armará la interfaz para solicitar el ingreso de Correo/Contraseña; y que, además de los proveedores mencionados anteriormente, también soporta Facebook. Adicionalmente, se le puede proveer un enlace para los Terminos de Servicio (ToS).
¿Y eso es todo? No, no es todo, el Activity que se lanzará nos retornará un resultado producto del inicio de sesión el cual deberemos manejar dentro de la función onActivityResult.
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
if(requestCode == RC_SIGN_IN){
if(resultCode == RESULT_OK){
startActivity(new Intent(this, Main3WelcomeActivity.class));
finish();
}
else{
Toast.makeText(this, "Hubo un problema con el logueo", Toast.LENGTH_SHORT).show();
}
}
}En la función se reciben tres parámetros de los cuales nos interesan los dos primeros. El primero, corresponde al código que enviamos al iniciar el activity; el segundo, corresponde a un código que se genera en el activity que se lanzó y este código de resultado puede tomar el valor de las constantes RESULT_OK o RESULT_CANCELED o en cristiano “se pudo o no se pudo efectuar el inicio de sesión”. Al realizarse el inicio de sesión estamos iniciando nuestro activity de bienvenida, en mi ejemplo el activity Main3WelcomeActivity.
Como resultado de esto deberíamos tener los siguientes flujos:
Paso 3: Establecer el flujo de registro o ¿qué hacer luego?
Luego de establecida la sesión podremos acceder a algunos datos básicos del usuario; en cierto tipo de aplicaciones, quizá lleve a obtener algunos datos provenientes de cada proveedor para luego solicitar la adición de algunos nuevos y guardarlos directamente en la base de datos.
En este punto podría aparecer la siguiente interrogante ¿debo guardar manualmente la información del usuario en la base de datos? La respuesta es “depende”.
Firebase ya almacena información proveniente del proveedor y esta puede ser accedida desde el aplicativo.
Entonces, volviendo a la interrogante, es posible que desees almacenar información extra en la base de datos y para ello deberemos crear un objeto que se dedique a contener esos datos. Luego, mediante referencias guardarlo en la base de datos. Es importante tomar en consideración que Firebase genera automáticamente un UID por cada usuario y este nos servirá para enlazar cada usuario almacenado con la información que guardemos en la base de datos. Si no recuerdan como almacenar datos pueden revisar mis artículos anteriores sobre Firebase.
Les comparto la porción de código que obtiene los datos y sí, estoy usando Glide :)
FirebaseAuth firebaseAuth = FirebaseAuth.getInstance();
FirebaseUser firebaseUser = firebaseAuth.getCurrentUser();
if(firebaseUser != null){
TextView txtDisplayName = (TextView) findViewById(R.id.txtUsername);
txtDisplayName.setText(firebaseUser.getDisplayName());
TextView txtEmail = (TextView) findViewById(R.id.txtEmail);
txtEmail.setText(firebaseUser.getEmail());
Uri imageUri = firebaseUser.getPhotoUrl();
ImageView imageAvatar = (ImageView) findViewById(R.id.imgAvatar);
Glide.with(this).load(imageUri).into(imageAvatar);
TextView txtUid = (TextView) findViewById(R.id.txtUid);
txtUid.setText(firebaseUser.getUid());
Toast.makeText(this, "Provider ID:" + firebaseUser.getProviderId(), Toast.LENGTH_SHORT ).show();
}Paso 4: Cerrar sesión y Eliminar la cuenta
Primero veremos cómo cerrar la sesión. En un principio, implementamos la interfaz OnClickListener e invocaremos a la función signOut (iba a llamarla cerrarSesión, pero no me gustó la combinación de inglés con español).
Button buttonSignOut = (Button) findViewById(R.id.signOutButton);
buttonSignOut.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
signOut();
}
});Esta es la porción de código de la función signOut():
private void signOut() {
AuthUI.getInstance().signOut(Main3WelcomeActivity.this).addOnCompleteListener(new OnCompleteListener<Void>() {
@Override
public void onComplete(@NonNull Task<Void> task) {
startActivity(new Intent(Main3WelcomeActivity.this, Main3Activity.class));
finish();
}
});
}Aquí hacemos uso de la clase AuthUI, sí la misma que usamos para el manejo del flujo, invocamos a su función signOut a la cual le enviaremos el contexto correspondiente al activity en el que nos encontramos, le adicionaremos también una implementación de la interfaz OnCompleteListener la cual se encargará de, mediante un Intent, llevarnos nuevamente a la pantalla de inicio de sesión y, también, de finalizar el activity actual.
Y hasta aquí llega este artículo, espero que les sea de utilidad. Espero en la próxima entrega ver la autenticación vía Firebase SDK. No olviden recomendar la publicación y compartirla. Si tienen comentarios, preguntas u observaciones sobre el código o el artículo, estas serán bienvenidas.
Les dejo también el enlace del proyecto en el que estoy trabajando este ejemplo.
Referencias:
- Firebase Authentication
https://firebase.google.com/docs/auth/ - Users in Firebase
https://firebase.google.com/docs/auth/users - Authenticate using Twitter on Android
https://firebase.google.com/docs/auth/android/twitter-login - Personalize your Android App with Firebase User Management
https://codelabs.developers.google.com/codelabs/firebase-auth-android/index.html - Getting a Result from an Activity
https://developer.android.com/training/basics/intents/result.html - FirebaseUI for Android — Auth
https://github.com/firebase/FirebaseUI-Android/blob/master/auth/README.md - Get a user’s provider-specific profile information https://firebase.google.com/docs/auth/android/manage-users#get_a_users_provider-specific_profile_information
Puedes revisar otros posts:
Si te agrado el posts puedes recomendar y compartir:
