Firebase es una plataforma de desarrollo de aplicaciones móviles y web. Proporciona servicios que una aplicación web o una aplicación móvil pueden requerir. Firebase proporciona autenticación de correo electrónico y contraseña sin la sobrecarga de construir el backend para la autenticación de usuarios. Google Sign-In es una forma segura de autenticar a los usuarios en sus aplicaciones. Reduce la molestia de lidiar y manejar esas contraseñas adicionales por parte del usuario para autenticarse en la aplicación. Firebase ofrece una gran cantidad de opciones para implementar el inicio de sesión en su aplicación, como correo electrónico, número de teléfono, Google, Facebook, etc.
¿Qué vamos a construir en este artículo?
Aquí hay un video de muestra de lo que vamos a construir en este artículo. Tenga en cuenta que usaremos el lenguaje Java para hacer esta aplicación.
Implementación paso a paso
Paso 1. Crear un nuevo proyecto
- Abra un nuevo proyecto.
- Estaremos trabajando en Actividad vacía con lenguaje como Java. Deje todas las demás opciones sin cambios.
- Asigne un nombre a la aplicación a su conveniencia.
- Habrá dos archivos predeterminados llamados activity_main.xml y MainActivity.java.
Si no sabe cómo crear un nuevo proyecto en Android Studio, puede consultar ¿Cómo crear/iniciar un nuevo proyecto en Android Studio?
Paso 2. Conectando Firebase con nuestra aplicación
- Vaya al sitio web https://firebase.google.com .
- Ve a la consola.
- Agregar proyecto
Asigne un nombre a su proyecto y haga clic en continuar y conecte su base de fuego a su cuenta de Google.
Después de completar el proyecto, aparecerá la siguiente interfaz:
Ahora ingrese el nombre del paquete y el nombre de su aplicación. Para ingresar el valor SHA-1, siga los pasos: vaya a Gradle> Tarea> android> informe de firma
Después de abrir el informe de firma, obtendrá el valor de SHA-1 como se muestra a continuación. Cópialo y úsalo en firebase.
Después de completar el paso anterior, descargue el archivo de configuración google-services.json que se proporciona allí y péguelo en Android Studio. Vaya a proyecto > aplicación > src y péguelo.
Ir a autenticación.
Vaya a Método de inicio de sesión y habilite el inicio de sesión de Google.
Paso 3. Agregar dependencias y complementos requeridos
Vaya a Gradle Scripts > build.gradle(project) y agregue la siguiente dependencia en él:
classpath 'com.google.gms:google-services:4.3.10'
Navegue a Gradle Scripts> build.gradle (módulo) y agregue el siguiente complemento en él:
apply plugin: 'com.google.gms.google-services'
Navegue a Gradle Scripts> build.gradle (módulo) y agregue las siguientes dependencias en él:
implementation 'com.google.firebase:firebase-auth:19.4.0' implementation 'com.google.android.gms:play-services-auth:18.1.0' implementation 'com.github.bumptech.glide:glide:4.11.0'
Paso 4. Agregar permiso de Internet
Vaya al archivo AndroidManifest.xml y agregue el siguiente código:
<uses-permission android:name="android.permission.INTERNET"/>
Paso 5. Trabajar con archivos XML
Vaya a la aplicación > res > diseño > actividad_principal.xml y agregue el siguiente código a ese archivo. A continuación se muestra el código para el archivo activity_main.xml .
XML
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <com.google.android.gms.common.SignInButton android:id="@+id/bt_sign_in" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:layout_marginStart="16dp" android:layout_marginTop="16dp" android:layout_marginEnd="16dp" android:layout_marginBottom="16dp" /> </RelativeLayout>
Vaya a la aplicación > haga clic con el botón derecho en > nuevo > actividad > actividad vacía y asígnele el nombre ProfileActivity. Use el siguiente código en el archivo activity_profile.xml-
XML
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:gravity="center" android:padding="16dp" tools:context=".ProfileActivity"> <ImageView android:layout_width="150dp" android:layout_height="150dp" android:id="@+id/iv_image"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/tv_name" android:textSize="24sp" android:textStyle="bold" android:textColor="@color/design_default_color_primary"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/bt_logout" android:text="Logout" android:layout_marginTop="32dp"/> </LinearLayout>
Paso 6. Trabajar con archivos Java
Vaya al archivo MainActivity.java y consulte el siguiente código. A continuación se muestra el código del archivo MainActivity.java. Se agregan comentarios dentro del código para comprender el código con más detalle.
Java
package com.example.googlesigninfirebase;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;
import com.google.android.gms.auth.api.signin.GoogleSignIn;
import com.google.android.gms.auth.api.signin.GoogleSignInAccount;
import com.google.android.gms.auth.api.signin.GoogleSignInClient;
import com.google.android.gms.auth.api.signin.GoogleSignInOptions;
import com.google.android.gms.common.SignInButton;
import com.google.android.gms.common.api.ApiException;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthCredential;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.auth.FirebaseUser;
import com.google.firebase.auth.GoogleAuthProvider;
public class MainActivity extends AppCompatActivity {
// Initialize variables
SignInButton btSignIn;
GoogleSignInClient googleSignInClient;
FirebaseAuth firebaseAuth;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Assign variable
btSignIn=findViewById(R.id.bt_sign_in);
// Initialize sign in options
// the client-id is copied form
// google-services.json file
GoogleSignInOptions googleSignInOptions=new GoogleSignInOptions.Builder(
GoogleSignInOptions.DEFAULT_SIGN_IN
).requestIdToken("438431947620-ecpi41uk3dhhf4mv8g8q993k3vs49ltm.apps.googleusercontent.com")
.requestEmail()
.build();
// Initialize sign in client
googleSignInClient= GoogleSignIn.getClient(MainActivity.this
,googleSignInOptions);
btSignIn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// Initialize sign in intent
Intent intent=googleSignInClient.getSignInIntent();
// Start activity for result
startActivityForResult(intent,100);
}
});
// Initialize firebase auth
firebaseAuth=FirebaseAuth.getInstance();
// Initialize firebase user
FirebaseUser firebaseUser=firebaseAuth.getCurrentUser();
// Check condition
if(firebaseUser!=null)
{
// When user already sign in
// redirect to profile activity
startActivity(new Intent(MainActivity.this,ProfileActivity.class)
.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK));
}
}
@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
super.onActivityResult(requestCode, resultCode, data);
// Check condition
if(requestCode==100)
{
// When request code is equal to 100
// Initialize task
Task<GoogleSignInAccount> signInAccountTask=GoogleSignIn
.getSignedInAccountFromIntent(data);
// check condition
if(signInAccountTask.isSuccessful())
{
// When google sign in successful
// Initialize string
String s="Google sign in successful";
// Display Toast
displayToast(s);
// Initialize sign in account
try {
// Initialize sign in account
GoogleSignInAccount googleSignInAccount=signInAccountTask
.getResult(ApiException.class);
// Check condition
if(googleSignInAccount!=null)
{
// When sign in account is not equal to null
// Initialize auth credential
AuthCredential authCredential= GoogleAuthProvider
.getCredential(googleSignInAccount.getIdToken()
,null);
// Check credential
firebaseAuth.signInWithCredential(authCredential)
.addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
@Override
public void onComplete(@NonNull Task<AuthResult> task) {
// Check condition
if(task.isSuccessful())
{
// When task is successful
// Redirect to profile activity
startActivity(new Intent(MainActivity.this
,ProfileActivity.class)
.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK));
// Display Toast
displayToast("Firebase authentication successful");
}
else
{
// When task is unsuccessful
// Display Toast
displayToast("Authentication Failed :"+task.getException()
.getMessage());
}
}
});
}
}
catch (ApiException e)
{
e.printStackTrace();
}
}
}
}
private void displayToast(String s) {
Toast.makeText(getApplicationContext(),s,Toast.LENGTH_SHORT).show();
}
}
Vaya al archivo ProfileActivity.java y use el siguiente código en él:
Java
package com.example.googlesigninfirebase;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import com.bumptech.glide.Glide;
import com.google.android.gms.auth.api.signin.GoogleSignIn;
import com.google.android.gms.auth.api.signin.GoogleSignInClient;
import com.google.android.gms.auth.api.signin.GoogleSignInOptions;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.auth.FirebaseUser;
public class ProfileActivity extends AppCompatActivity {
// Initialize variable
ImageView ivImage;
TextView tvName;
Button btLogout;
FirebaseAuth firebaseAuth;
GoogleSignInClient googleSignInClient;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_profile);
// Assign variable
ivImage=findViewById(R.id.iv_image);
tvName=findViewById(R.id.tv_name);
btLogout=findViewById(R.id.bt_logout);
// Initialize firebase auth
firebaseAuth=FirebaseAuth.getInstance();
// Initialize firebase user
FirebaseUser firebaseUser=firebaseAuth.getCurrentUser();
// Check condition
if(firebaseUser!=null)
{
// When firebase user is not equal to null
// Set image on image view
Glide.with(ProfileActivity.this)
.load(firebaseUser.getPhotoUrl())
.into(ivImage);
// set name on text view
tvName.setText(firebaseUser.getDisplayName());
}
// Initialize sign in client
googleSignInClient= GoogleSignIn.getClient(ProfileActivity.this
, GoogleSignInOptions.DEFAULT_SIGN_IN);
btLogout.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// Sign out from google
googleSignInClient.signOut().addOnCompleteListener(new OnCompleteListener<Void>() {
@Override
public void onComplete(@NonNull Task<Void> task) {
// Check condition
if(task.isSuccessful())
{
// When task is successful
// Sign out from firebase
firebaseAuth.signOut();
// Display Toast
Toast.makeText(getApplicationContext(), "Logout successful", Toast.LENGTH_SHORT).show();
// Finish activity
finish();
}
}
});
}
});
}
}
Aquí está el resultado final de nuestra aplicación.
Producción:
Además, puede ver que dentro de Firebase se almacenan los datos de los usuarios.
Publicación traducida automáticamente
Artículo escrito por jangirkaran17 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA