Flutter
...
User Authentication
Authentication

Inicio de Sesión y Cierre en Flutter con Parse Server

15min

Inicio de sesión y cierre de sesión de usuario para Flutter usando Parse Server

Introducción

Después de implementar el registro de usuario para Flutter en Parse en la última guía, aprenderás cómo iniciar y cerrar sesión de usuarios utilizando la misma clase ParseUser. Después de un registro, la operación de inicio de sesión se realiza automáticamente y se crea una nueva sesión de usuario. La operación de cierre de sesión elimina el objeto de sesión activa para el usuario conectado.

En esta guía, aprenderás cómo usar el plugin de Flutter para Parse Server para realizar inicio/cierre de sesión utilizando la clase ParseUser para tu aplicación Flutter.

Objetivo

Construir una función de inicio/cierre de sesión de usuario utilizando Parse para una aplicación Flutter.

Requisitos previos

Para completar este tutorial, necesitarás:

Entendiendo la Aplicación de Inicio/Cierre de Sesión

Para entender mejor el proceso de Inicio de Sesión/Cierre de Sesión, crearemos una aplicación para iniciar y cerrar sesión en tu cuenta.

No explicaremos el código de la aplicación Flutter ya que el enfoque principal de esta guía es usar Flutter con Parse. Siguiendo los siguientes pasos, construirás una aplicación de Inicio y Cierre de Sesión en la base de datos de Back4App.

¡Empecemos!

En los siguientes pasos, podrás construir una aplicación de Inicio/Cierre de sesión.

1 - Crea la plantilla de la aplicación de Inicio/Cierre de sesión

Abre tu proyecto de Flutter de la guía anterior Flutter plugin for Parse Server. Ve al main.dart archivo, limpia todo el código y reemplázalo con:

Dart


Cuando debug el parámetro en la función Parse().initialize es true, permite mostrar las llamadas a la API de Parse en la consola. Esta configuración puede ayudar en la depuración del código. Se recomienda desactivar el debug en la versión de lanzamiento.

2 - Conectar la plantilla al proyecto de Back4app

Encuentra tu Id de Aplicación y las credenciales de Clave de Cliente navegando a tu panel de control de la aplicación en Sitio web de Back4App.

Actualiza tu código en main.dart con los valores de ApplicationId y ClientKey de tu proyecto en Back4app.

  • keyApplicationId = Id de Aplicación
  • keyClientKey = Clave de Cliente

Ejecuta el proyecto, y la aplicación se cargará como se muestra en la imagen.



3 - Código para Iniciar Sesión de Usuario

La función de Inicio de Sesión de Usuario crea un Sesión objeto, que apunta al Usuario que ha iniciado sesión y almacena en tu almacenamiento local una sesión de usuario válida.

Las llamadas futuras a métodos como currentUser recuperarán con éxito tus datos de Usuario y sessionToken para el Sesión objeto que se creó en el Tablero.

Busca la función doUserLogin en el archivo main.dart. Reemplaza el código dentro de doUserLogin con:

Dart


Para construir esta función, sigue estos pasos:

  1. Crea una nuevaParseUser instancia de clase con el comando ParseUser(username, password, null); usando los datos ingresados en la aplicación. El campo de correo electrónico no es necesario y debe ser informado con null.
  2. Llama a lalogin función, que creará una Sesión en tu base de datos en el Panel de Control de Parse y guardará el token en el almacenamiento local.
  3. Verifica si el inicio de sesión del usuario fue exitoso. Si no fue exitoso, muestra el mensaje de descripción del error.

La función completa debería verse así:

Dart


Para probarlo, haz clic en el Ejecutar botón en Android Studio/VSCode.



Después de proporcionar las credenciales de usuario deseadas, verás este mensaje después de presionar Iniciar sesión si todo fue exitoso:



El manejo de errores se puede probar si intentas iniciar sesión con un usuario con credenciales inválidas:



Recibirás otro error si intentas iniciar sesión sin contraseña:



4 - Código para Cerrar Sesión del Usuario

La función de Cerrar Sesión del Usuario elimina el Sesión objeto, que fue creado en la función de inicio de sesión. Limpiará esta sesión en el dispositivo y cerrará sesión de cualquier servicio vinculado en tu servidor Parse.

Busca la función doUserLogout en el archivo main.dart. Reemplaza el código dentro de doUserLogout con:

Dart


Para construir esta función, sigue estos pasos:

  1. Obtén el usuario actualmente conectado usando la funciónParseUser.currentUser().
  2. Llama a lalogout función para el ParseUser objeto, que eliminará la Sesión en tu base de datos y limpiará el token en el almacenamiento local.
  3. Verifica si la desconexión del usuario fue exitosa. Si no fue exitosa, muestra el mensaje de descripción del error.

El código completo debería verse así:

Dart


Para probarlo, haz clic en el Ejecutar botón en Android Studio/VSCode.



Después de proporcionar las credenciales de usuario deseadas, verás este mensaje después de presionar en Iniciar sesión si todo fue exitoso:



Haz clic en el botón “Cerrar sesión”:



¡Está hecho!

Al final de esta guía, puedes iniciar y cerrar sesión en los usuarios de Parse de tu aplicación utilizando las características principales de Parse Server a través de Back4App!