Guía completa para configurar Cloud Functions con Flutter

¿Para qué sirven las Firebase Cloud Functions?

Firebase Cloud Functions es un servicio backend sin servidor (serverless) que te permite desplegar funciones backend que se ejecutan automáticamente en respuesta a eventos de Firebase o servicios externos. Por ejemplo, pueden activarse ante cambios en tu base de datos, autenticaciones de usuarios o solicitudes HTTP.

Aquí tienes algunos ejemplos concretos de cómo puedes usar Cloud Functions:

1. Envío de notificaciones push automáticas: Puedes enviar automáticamente una notificación a un usuario cuando recibe un nuevo mensaje.
2. Procesamiento de pagos: Si tu aplicación Flutter incluye un sistema de pagos, puedes usar Cloud Functions para verificar la información antes de agregarla a tu base de datos.
3. Gestión de permisos y seguridad: Si un usuario intenta modificar un campo específico en Firestore, una Cloud Function puede verificar los permisos antes de autorizar o denegar la modificación.
4. Limpieza automática de datos: Al eliminar una cuenta de usuario, una función puede activarse para borrar automáticamente todos los datos relacionados.

Cómo configurar Cloud Functions con Flutter en Visual Studio

A continuación, se presenta una lista de pasos para configurar funciones backend con Firebase Cloud Functions y Flutter en Visual Studio.

Preparación del proyecto en Firebase

Antes de configurar tus Cloud Functions, es importante asegurarte de que tu proyecto Firebase esté configurado correctamente. Para ello, accede a tu consola Firebase y dirígete a la sección Cloud Functions.

Si aún no lo has hecho, asegúrate de haber activado el plan Blaze (facturación según uso), necesario para utilizar las Cloud Functions. Comienza creando una cuenta de facturación en Google Cloud si no tienes una. Luego, añade tu información de facturación, así como una tarjeta de crédito válida, para poder pagar según el uso.

Configuración de las Cloud Functions en Visual Studio

Una vez que tu proyecto Firebase esté configurado, deberás añadir una carpeta llamada functions en tu proyecto Flutter. Como su nombre indica, esta carpeta almacenará tus funciones y te permitirá implementarlas en Firebase. Aquí están los pasos:

1. Instalar Firebase CLI: Abre un terminal y ejecuta el siguiente comando para instalar Firebase CLI de forma global si aún no lo has hecho:

npm install -g firebase-tools

2. Conecta tu proyecto a Firebase: Desde la raíz de tu proyecto, inicia sesión en tu cuenta Firebase usando el siguiente comando:

firebase login

Si ya has iniciado sesión, verifica que tienes acceso a tus proyectos Firebase con este comando:

firebase projects:list

Si encuentras el error Failed to list Firebase projects. See firebase-debug.log for more info., vuelve a autenticarte utilizando:

firebase login --reauth

Sigue las instrucciones para finalizar la conexión.

Inicialización de las Cloud Functions

Ahora que estás conectado a Firebase, puedes inicializar las Cloud Functions en tu proyecto. Sigue estos pasos:

1. Desde la raíz de tu proyecto, ejecuta el siguiente comando:

firebase init

2. En el menú que aparece, selecciona la opción Functions: Configure a Cloud Functions directory and its files. Usa la barra espaciadora para seleccionarla y presiona Enter.

3. Cuando te pidan elegir un proyecto, selecciona Use an existing project y elige tu proyecto Firebase.

4. A continuación, selecciona un lenguaje para escribir tus funciones. Las opciones disponibles son JavaScript, TypeScript y Python. Se recomienda utilizar TypeScript, como se indica en la documentación oficial de Firebase.

5. A la pregunta «¿Quieres usar ESLint para detectar errores probables y mantener el estilo?», selecciona Yes (Y). ESLint te ayudará a detectar errores de sintaxis antes del despliegue. Sin embargo, ten en cuenta que seleccionar esta opción hará imposible el despliegue si hay errores pendientes por corregir.

6. Por último, para instalar automáticamente las dependencias necesarias, responde Yes a la pregunta «¿Quieres instalar las dependencias con npm ahora?».

Preparación de la carpeta functions

Después de completar la inicialización, puedes verificar rápidamente que todo esté correctamente configurado en la carpeta functions. Sigue estos pasos:

1. Accede a la carpeta functions usando este comando:

cd functions

2. Asegúrate de que todas las dependencias estén instaladas y actualizadas ejecutando:

npm install

La configuración de las Cloud Functions para tu proyecto Flutter está ahora completa. Solo queda escribir tus funciones e implementarlas en Firebase.

Instalar el paquete Cloud Firestore

Finalmente, el último paso será instalar el paquete Cloud Firestore en su última versión (5.6.2) en tu proyecto Flutter. Para hacerlo, puedes:

• Ejecutar el comando $ flutter pub add cloud_firestore en tu terminal de comandos;
• Copiar y pegar cloud_firestore: ^5.6.2 en tus dependencias dentro del archivo pubspec.yaml.

Finalmente, añade la siguiente línea de importación en los archivos donde desees usar las funciones de Cloud Firestore que hayas programado:

import 'package:firebase_auth/firebase_auth.dart';

Escribir tus funciones en Visual Studio

Antes de desplegar tus funciones, el primer paso es escribirlas en el lenguaje que hayas elegido. Aunque podría escribir guías sobre el uso de TypeScript, mi consejo es que utilices ChatGPT para ayudarte a codificar. Este enfoque funciona muy bien, siempre que seas claro y preciso al describir las acciones que deseas realizar y los momentos en los que deben ejecutarse.

¿Dónde escribir tus funciones?

Una vez que Firebase ha sido inicializado en tu proyecto con el comando firebase init, se crea una carpeta llamada functions en la raíz. Es en esta carpeta donde escribirás tus Cloud Functions, en el archivo index.js o index.ts, dependiendo del lenguaje elegido.

Errores comunes de TypeScript y soluciones

Error: Indentación incorrecta

• Mensaje de error: Expected indentation of X spaces but found Y indent
• Solución: Revisa la indentación de tus líneas. TypeScript, cuando está configurado con ESLint, espera un número específico de espacios o tabulaciones para cada nivel de anidación en el código. Por ejemplo, si ves «Expected indentation of 12 spaces but found 10», debes agregar dos espacios o ajustar las tabulaciones para que coincidan con la convención de indentación.

Error: Espacios al final de la línea prohibidos

• Mensaje de error: Trailing spaces not allowed
• Solución: Elimina los espacios innecesarios al final de la línea de código. Puedes hacerlo manualmente o utilizando herramientas de autoformateo como Prettier.

Error: Línea demasiado larga

• Mensaje de error: This line has a length of X. Maximum allowed is Y
• Solución: Reduce la longitud de la línea al límite especificado (generalmente 80 o 100 caracteres). Para ello, puedes dividir la línea en varias o usar variables intermedias para hacer el código más legible.

Error: Variable no utilizada

• Mensaje de error: Variable 'X' is declared but its value is never read
• Solución: Elimina las variables declaradas que nunca se utilizan, o úsalas correctamente en el código. Este error ayuda a evitar código innecesario o obsoleto.

Error: Importación no utilizada

• Mensaje de error: 'X' is defined but never used
• Solución: Retira las importaciones de módulos o funciones que no utilizas. Las importaciones innecesarias pueden hacer el código más pesado sin motivo.

Error: Tipado incorrecto

• Mensaje de error: Type 'X' is not assignable to type 'Y'
• Solución: Verifica que los tipos de las variables, parámetros y retornos de funciones sean correctos. Si intentas asignar un valor de un tipo no compatible, ajusta el tipo o convierte el valor para que coincida con el tipo esperado.

Error: Función async faltante

• Mensaje de error: Expected 'await' to be called inside an async function
• Solución: Si utilizas await dentro de una función, asegúrate de que la función esté definida como async. Agrega la palabra clave async antes de la declaración de la función.

Error: Valor null o undefined no gestionado

• Mensaje de error: Object is possibly 'null' or 'undefined'
• Solución: Utiliza verificaciones de nulidad antes de acceder a objetos o valores. También puedes usar operadores como ?. o ?? para manejar estos casos sin provocar un error.

¿Cómo desplegar tus funciones?

Una vez que tus funciones estén escritas, puedes desplegarlas en Firebase ejecutando el siguiente comando desde la raíz de tu proyecto:

firebase deploy --only functions

Cuando tus funciones estén desplegadas en la nube, se ejecutarán según los eventos que hayas definido.

Verificar si tu función funciona

Una vez que tus funciones estén desplegadas, debes probarlas. Te recomiendo usar estas tres herramientas:

Emulador: Puedes usar la herramienta Firebase Emulator para probar tus funciones localmente antes de desplegarlas, con el comando:

firebase emulators:start

Esto te permite simular eventos y verificar si todo funciona como se espera.

Registros de Firebase: Después del despliegue, puedes monitorear las ejecuciones consultando los registros en tiempo real, ya sea desde Firebase (en el menú de tres puntos de las Cloud Functions) o en Visual Studio con el comando:

firebase functions:log

Cloud Scheduler: Si tienes funciones que deben ejecutarse a intervalos regulares pero no quieres esperar, puedes usar Cloud Scheduler para forzar su ejecución.

Precios del servicio Cloud Functions

El precio es un aspecto importante al elegir las tecnologías para tu aplicación. Firebase ofrece un plan gratuito con cuotas limitadas y una facturación por uso para volúmenes más grandes, a través del plan Blaze.

Explicaciones:

• Invocaciones: Número de veces que se llama a una función.
• Tiempo de CPU: Tiempo durante el cual la función utiliza recursos de cálculo.
• Memoria: Cantidad de memoria consumida por tus funciones durante su ejecución.
• Salida de red: Cantidad de datos enviados por las funciones Cloud (p. ej., hacia otro servidor o API externa).

Conclusión

Ahora estás en capacidad de configurar eventos en el backend de tu aplicación. ¿Por qué no implementar un sistema de notificaciones push para interactuar con tus usuarios?

Implementar notificaciones push en Flutter →