36

Crear una API con Firebase Cloud Functions

16517Puntos

hace 2 años

Curso de Firebase Cloud Functions
Curso de Firebase Cloud Functions

Curso de Firebase Cloud Functions

¿Quieres experimentar acceso a los servicios de Firebase en tiempo real y con un rendimiento nunca antes visto? No esperes más para ser testigo de Firebase Cloud Functions y empieza ya a armar tus proyectos de manera fácil, rápida e intuitiva.

Con Firebase Cloud Functions podemos ejecutar código sin necesidad de construir un robusto Backend, esto nos permite tener código almacenado en la nube de Google, sin necesidad de preocuparnos por escalar nuestros propios servidores o complicarnos con grandes configuraciones. Teniendo en cuenta esto, crearemos una función que expone los datos de una base de datos en Firebase.

NOTA: Antes de iniciar este recurso es necesario tener una cuenta verificada de Firebase, si no tienes una cuenta, crea una desde firebase.com.

Aprenderemos:

  1. Configurar nuestro proyecto
  2. Instalar y configurar un proyecto con Firebase Cloud Functions
  3. Crear una base de datos realtime con Firebase
  4. Exponer la información de la base de datos por medio de Firebase Cloud Functions
  5. Subir nuestro proyecto a producción.

Configurar nuestro proyecto

Nos dirigimos a nuestra carpeta de desarrollo y creamos un proyecto nuevo.

mkdir firebase-api && cd firebase-api

Preparar nuestro proyecto con git

git init

Inicializamos nuestro proyecto con npm

npm init -y

Ahora que tenemos nuestro proyecto es necesario dirigirnos a console.firebase.com y creamos un nuevo proyecto, en mi caso le asigne el nombre de: “arepa-dev-api”, puedes elegir el nombre que más se adapte a ti.

Instalación de Firebase

Para poder utilizar todas las bondades de Firebase en nuestro proyecto es necesario tener instalado Firebase-tools. En nuestra consola y con permisos de administrador instalamos firebase-tools de forma global.

npm install -g firebase-tools

Una vez instalado este paquete iniciamos sesión desde la terminal/consola.

firebase login

Esto nos pedirá abrir un navegador e iniciar sesión con nuestra cuenta en firebase para autorizar el uso de firebase-tools en nuestro equipo.

Configuración de Firebase Cloud Functions

Dentro de nuestro proyecto ejecutamos el siguiente comando:

firebase init

Nos permite configurar nuestro proyecto, para este recurso necesitamos seleccionar “Functions” y a continuación nos da la opción de crear un proyecto o elegir uno existente, elegimos el que creamos recientemente, en mi caso “arepa-dev-api”.

Otras configuraciones:

¿Qué idioma le gustaría usar para escribir Funciones en la Nube? Javascript
¿Desea utilizar ESLint para detectar posibles errores y aplicar el estilo? Y
Las funciones de archivo / package.json ya existen. Sobrescribir Y
¿Quieres instalar dependencias con npm ahora? Y

Una vez que termine la instalación y configuración ahora podemos exponer los datos de Firebase Realtime Database.

Crear una base de datos con Firebase

En la consola de Firebase y dentro de nuestro proyecto habilitaremos el uso de Firebase Database y elegimos la opción de Realtime Database.

Ahora vamos a crear un archivo en la raíz del proyecto al cual llamaremos db.json.

touch db.json

Con nuestro editor de código favorito, editamos este archivo y añadimos los datos: Descargar datos de ejemplo.

Subir la base de datos a Firebase:

firebase database:set /me data.json  -P arepa-dev-api
Donde:

/me - Es el objeto donde vivirá la información
-P arepa-dev-pi -es el proyecto en mi caso “arepa-dev-api” y aquí debes de poner el nombre de tu proyecto.

Ejecutado el comando y nos pedirá confirmar que sobreescribirá los datos, aceptamos.

Crear función para mostrar los datos

Con nuestro editor de código favorito (En mi caso utilizo VSCode) abrimos el proyecto y nos dirigimos a la carpeta “Functions” que nos creo el asistente de firebase y buscamos el archivo “index.js”.

Para este paso necesitamos descargar el archivo “firebase-config.json” desde firebase.com, nos dirigimos al proyecto y en Configuración / Cuentas de servicio / Firebase Admin SDK / Generar nueva llave privada. Descargamos el archivo lo renombrados “firebase-config.json” y colocamos en la raíz del proyecto.

// Importamos functions desde firebasebase-funcionsconst functions = require('firebase-functions');
// Importamos firebase-admin para conectarnos con la base de datosconst firebase = require('firebase-admin');
// Importamos el archivo de configuración que descargamosconst config = require('./firebase-config.json');
// inicializamos nuestra aplicación
firebase.initializeApp({
  credential: firebase.credential.cert(config),
  databaseURL: 'https://arepa-dev-api.firebaseio.com'// URL de nuestro proyecto
});

// creamos la función que obtiene los recursos de nuestra firebase database 
exports.api = functions.https.onRequest((req, res) => {
  res.header('Content-Type', 'application/json');
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  if (req.method === 'GET') {
    const data = firebase.database().ref('/me') // Hacemos referencia a la base de datos
    data.on('value', (snapshot) => {
      res.json(snapshot.val()); // El elemento resultante lo exponemos en un archivo JSON
    });
  }
});

Ahora tenemos nuestro archivo configurado y listo, es momento de enviar a producción.

Enviar a producción

Firebase CLI nos provee un comando con el cual podemos enviar a producción el proyecto que acabamos de crear.

firebase deploy

Al ejecutar este comando puede tardar un poco, seamos pacientes y esperemos la construcción del proyecto. Cuando este listo la consola nos mostrara un mensaje donde podremos ver la URL de nuestra función para ser utilizada donde la necesitemos.

En mi caso la URL donde expongo la información de mi base de datos es la siguiente: https://us-central1-arepa-dev-api.cloudfunctions.net/api

En la consola de Firebase en el apartado de “Functions” encontraras la información de la función que acabamos de crear, como acceder, logs, salud de la función, así como el consumo.

Si necesitas realizar un cambio en la información, solo debes de editar el archivo db.json de tu proyecto y volver a ejecutar el comando de “firebase dabatese:set /me -P {PROYECTO}”.

Probar nuestra API

Recomiendo utilizar PostMan para probar la función y ver los datos expuestos de tu base de datos.

postman-firebase-cloud-functions.png

En Conclusión

Aprendimos a crear un proyecto donde configuramos y exponemos la información almacenada en Firebase Realtime Database, por medio de una Cloud Function. Si quieres aprender más de cómo crear fenomenales proyectos sin tanta configuración de servidores te invito a tomar el curso de Firebase Cloud Functions.

Te dejo el repositorio en Github para que puedas probar este recurso: Firebase-api

Curso de Firebase Cloud Functions
Curso de Firebase Cloud Functions

Curso de Firebase Cloud Functions

¿Quieres experimentar acceso a los servicios de Firebase en tiempo real y con un rendimiento nunca antes visto? No esperes más para ser testigo de Firebase Cloud Functions y empieza ya a armar tus proyectos de manera fácil, rápida e intuitiva.
Oscar
Oscar
@gndx

16517Puntos

hace 2 años

Todas sus entradas
Escribe tu comentario
+ 2
Ordenar por:
5
7Puntos

Hola, soy nueva con esta herramienta y tratando de seguir con el tutorial me encuentro con este error al ejecutar firebase deploy, alguien me podría apoyar…Gracias!!! 2019-04-15 (1).png

2
16517Puntos
2 años

Hola, @ely-monroy ¿tienes el proyecto en github? puedes pasarme tu URL y te ayudo a encontrar el error.

0
13595Puntos
un año

Hola Amigo! Probé tu api y al igual que la mía no cargan gan los datos en mi app. pero la del tutorial si carga , me parece curioso es que al final de las url la que si carga termina em “/me” y al igual que la mía terminan en “api”, sabes que puede ser ? gracias!

1
4763Puntos
un año

Hola me parece que ya lo resolviste?, yo le he hecho un GET a tu API desde Postman, también usé AJAX y Fetch y si trae los datos.

con Fetch

fetch('https://us-central1-marius-api.cloudfunctions.net/api')
    .then(function(response) {return response.json()
    })
    .then(function(data) {
        console.log(data)
    })
    .catch(function() {
        console.log('algo salio mal')
    });

con AJAX

functiongetDataFirebase() {
    let URL = 'https://us-central1-marius-api.cloudfunctions.net/api'const xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (this.status == 200 && this.readyState == 4) {
            let response = JSON.parse(this.responseText)
            console.log(response)
        }
    }
    xhr.open('GET', URL, true);
    xhr.send();
}

getDataFirebase();
1
13595Puntos
un año

Hola! que genial, aun no lo resuelvo al parecer es un tema de intercambio de recursos de origen cruzado o CORS según lo que me arroja la consola del navegador, he echo algunos pero no me carga los datos, estaré agradecido si alguno me puede iluminar xD… 😦

1
13595Puntos
un año

Index.js de mi api

1
13595Puntos
un año

Screenshot Navegador !

1
4763Puntos
un año

🤔 me parece que no estas haciendo fetch a la URL correcta.
Ve a https://console.firebase.google.com/ , ingresa a tu proyecto, ve a la opción […] Functions donde veras un Dashboard y verifica que la URL de la columna Trigger es la misma a la que haces la petición.
Saludos.

3
9871Puntos

Excelente tutorial-entradaBlog! Muchas gracias, directo y fácil de entender.

2
13595Puntos
2 años

Hola, queria preguntarte porque no me carga el db.json en la consola de la database? despues que ejecuto deploy

2
4763Puntos
un año

Pueba ejecutando primero

 firebase use--add
2
7424Puntos

Que buen tutorial, tengo una duda.
Si tengo un archivo .json con miles de elementos (4mb), ¿Si lo subo a Firebase la carga puede ser más rápida?
Yo lo uso directamente en la misma carpeta y los llamo usando Fetch, pero se demora mucho en responder.

2
7036Puntos

Súper! Hay bastante por aprender! necesito más de 24 horas en un día!

https://us-central1-api-cv-3b8cb.cloudfunctions.net/api

1
13595Puntos
un año
Screenshot 2019-06-10 14.27.37.png

Hola, Al ejecutar el comando firebase database:set //me db.json -P api-portfolio me da el error que aparece la imanen … sabes que puede ser te agradezco ! tambien ya lo ejecute con sudo

2
8761Puntos
un año

Con firebase use --add, agregar el proyecto a la configuracion y luego agregar el json de los datos

2
6461Puntos

Excelente aporte, espero verte en talent land 😄

1
16517Puntos
2 años

Hay estaremos en talent land 😃

1
940Puntos

Hola compas ya he intentado hacer deploy de varias formas y siempre me sale el mismo error.

Error: Error parsing triggers: Cannot find module ‘firebase-config.json’

Try running “npm install” in your functions directory before deploying.

Having trouble? Try firebase deploy --help

Alguien puede ayudarme a solucionarlo he cambiado el archivo firebase-config.json de la raiz del proyecto a la carpeta functions y no he podido dar solución alguna idea. Gracias

1
391Puntos

Hubo mucho proceso de debug que hacer,pero el resultado valio la pena jajaja,encontre la solucion al problema al descrubrir el log de errores en firebase.

1
8168Puntos

Excelente gracias por el aporte 😃

1
3Puntos

hola tengo un problema al ejecutar firebase deploy en la consola. me da

=== Deploying to 'curriculum-vitae-d4fd0'...

i  deploying functions, hosting
Running command: npm --prefix "$RESOURCE_DIR" run lint

> [email protected] lint C:\Users\Felipe\Documents\Dev\firebase-api\functions
> tslint -p tslint.json

"tslint" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] lint: `tslint -p tslint.json`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] lint script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Felipe\AppData\Roaming\npm-cache\_logs\2020-05-04T18_13_06_432Z-debug.log
events.js:287
      throw er; // Unhandled 'error' event
      ^

Error: spawn npm --prefix "%RESOURCE_DIR%" run lint ENOENT
    at notFoundError (C:\Users\Felipe\AppData\Roaming\npm\node_modules\firebase-tools\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:6:26)
    at verifyENOENT (C:\Users\Felipe\AppData\Roaming\npm\node_modules\firebase-tools\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:40:16)
    at ChildProcess.cp.emit (C:\Users\Felipe\AppData\Roaming\npm\node_modules\firebase-tools\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:27:25)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
Emitted 'error' event on ChildProcess instance at:
    at ChildProcess.cp.emit (C:\Users\Felipe\AppData\Roaming\npm\node_modules\firebase-tools\node_modules\cross-env\node_modules\cross-spawn\lib\enoent.js:30:37)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) {
  code: 'ENOENT',
  errno: 'ENOENT',
  syscall: 'spawn npm --prefix "%RESOURCE_DIR%" run lint',
  path: 'npm --prefix "%RESOURCE_DIR%" run lint',
  spawnargs: []
}

Error: functions predeploy error: Command terminated with non-zero exit code1```
nose como solucionarlo. ya busque distintas soluciones en varios foros pero ninguna funciona
1
2968Puntos

Holas ✌️
Alguna recomendación para realizar pruebas en local? 🤔
Dicho de otro modo, para realizar el deploy solo al estar 100% seguro de que funciona, porque en scripts/proyectos mas grandes seria algo engorroso 🙃

1
129Puntos

Hola! en esta linea, firebase database:set /me data.json -P arepa-dev-api

Entiendo que /me data.json
ahí sería nombrarlo como el mismo db.json que se creo mucho antes?

1
6553Puntos

A alguien más le sale este error y pueda guiarme para resolverlo?

Al parecer requiere subir del plan gratuito a uno de pago, pero creo que tiene que ver con mi configuración también.


Screen Shot 2020-08-26 at 11.47.04.png
2
6553Puntos
3 meses

Encontré la solución a este problema, y efectivamente es por el plan de pago.

Firebase Cloud Functions ya no es gratuito, ahora se basa en pago por uso, todavía cuenta con la capa gratuita pero para habilitarla necesitas validar una tarjeta de crédito.
Estas nuevas modificaciones de uso de Firebase Cloud Functions son recientes (Junio 2020), y al parecer afectan a todos los que usamos Node 10 para hacer el deploy.

Más información acerca de esto:
https://www.reddit.com/r/Firebase/comments/go64nh/are_firebase_cloud_function_now_paid_only/

Los precios y limites entre planes:
https://firebase.google.com/pricing

1
8842Puntos

Tengo un problema, y es que en el paso de:
subir la base de datos a firebase
firebase database:set /me data.json -P arepa-dev-api

Respondo que si a sobreescribir y me salta un error:
An unexpected error has ocurred

A que se debe?

2
2 meses

Se debe a que en data.json debes colocar db.json (si es que haz seguido el mismo paso a paso de Oscar o si no entonces el nombre que le colocaste a la base de datos cuando la creaste utilizando el comando touch)

1
7400Puntos

Help Me! cuano uso el comando

firebase database:set /me data.json -P arepa-dev-api

dice lo siguiente:

Error: Path must beginwith /
1
7400Puntos
un año

ya resolvi, resulta que falta una barra inclina

asi es el comando

firebase database:set /me {nombre_del_archivo_json}.json -P {nombre_proyecto}

en nuestro caso remplazar:

{nombre_del_archivo_json} = db
{nombre_proyecto} = el nombre de tu proyecto en firebase

1
7400Puntos
un año

:V asi si:

firebase database:set//me {nombre_del_archivo_json}.json -P {nombre_proyecto}
1
4763Puntos
un año

Hola, que bueno que lo resolviste, pero a mí me funcionó con una sola barra, así 😊:

firebase database:set /me ./server/db.json -P PVU
1
12Puntos

Hola, yo tengo una consulta, hay alguna manera de subir una api ya creada en express o feathersjs a firebase? esto es posible? y perdón por mi ignorancia.

Saludos.

1
1269Puntos

Tengo una pequeña duda… Porqué cuando hago el test en PostMan me sale un error pero cuando lo pongo en el navegador los datos de mi db me los trae correctamente? a que se debe?