Flutter
Parse SDK (REST)
Integración de Cloud Functions en Flutter con Parse SDK
18 min
uso de cloud functions en una aplicación flutter introducción para aplicaciones complejas, a veces solo necesitas un poco de lógica que no se esté ejecutando en un dispositivo móvil cloud code hace esto posible cloud code es fácil de usar porque está construido sobre el mismo sdk de javascript de parse que impulsa miles de aplicaciones la única diferencia es que este código se ejecuta en tu servidor parse en lugar de ejecutarse en el dispositivo móvil del usuario puedes usar cloud code para descargar el procesamiento a los servidores de parse, aumentando así el rendimiento percibido de tu aplicación puedes crear hooks que se ejecuten cada vez que se guarda o se elimina un objeto esto es útil si deseas validar o sanitizar tus datos también puedes usar cloud code para modificar objetos relacionados o iniciar otros procesos, como enviar una notificación push cuando actualizas tu cloud code, se vuelve disponible para todos los entornos móviles al instante no tienes que esperar a una nueva versión de tu aplicación esto te permite cambiar el comportamiento de la aplicación sobre la marcha y agregar nuevas características más rápido esta sección explica cómo crear y desplegar cloud code, seguido de cómo llamar a una función en la nube en proyectos flutter a través de back4app en esta guía, el enfoque es demostrar el uso de cloud function a través de flutter puedes encontrar información más detallada en documentación oficial de cloud code de parse requisitos previos para completar este tutorial, necesitarás flutter versión 2 2 x o posterior https //flutter dev/docs/get started/install android studio https //developer android com/studio o vs code instalado (con plugins dart y flutter) una aplicación creada en back4app nota sigue el tutorial de nueva aplicación parse para aprender cómo crear una aplicación parse en back4app una aplicación flutter conectada a back4app nota sigue el instalar parse sdk en el proyecto flutter para crear un proyecto flutter conectado a back4app un dispositivo (o dispositivo virtual) que ejecute android o ios objetivo ejecuta el código de cloud parse en back4app desde una aplicación flutter 1 crea un archivo de código en la nube ve a tu aplicación en el sitio web de back4app https //www back4app com/ y haz clic en configuración del servidor configuración del servidor encuentra el código en la nube código en la nube y haz clic en funciones y alojamiento web funciones y alojamiento web se ve así 3\ sube o crea un nuevo archivo (también puedes editar el actual main js main js directamente en el navegador) luego, haz clic en desplegar desplegar como se muestra aquí tu main js main js debería verse así 1 parse cloud define("hello", async (request) => { 2 console log("hello from cloud code!"); 3 return "hello from cloud code!"; 4 }); 5 6 parse cloud define("sumnumbers", async (request) => { 7 return (request params number1 + request params number2); 8 }); 9 10 parse cloud define("createtodo", async (request) => { 11 const title = request params title; 12 const done = request params done; 13 14 const todo = parse object extend('todo'); 15 const todo = new todo(); 16 todo set('title', title); 17 todo set('done', done); 18 19 try { 20 await todo save(); 21 return todo; 22 } catch (error) { 23 console log('todo create error ' + error code + ' ' + error message); 24 } 25 }); 26 27 parse cloud define("getlisttodo", async (request) => { 28 let query = new parse query("todo"); 29 query descending("done"); 30 return await query find(); 31 }); pasas parámetros a tu función en la nube desde tu aplicación flutter y accedes a ellos dentro del request params request params objeto 2 entendiendo la clase parsecloudfunction la parsecloudfunction parsecloudfunction clase define métodos para interactuar con las funciones de nube de parse una función de nube se puede llamar con parsecloudfunction execute({parameters params}) parsecloudfunction execute({parameters params}) que devuelve un objeto de mapa o parsecloudfunction executeobjectfunction<>({parameters params}) parsecloudfunction executeobjectfunction<>({parameters params}) que devuelve un parseobject los parámetros son opcionales y se espera un objeto de mapa 3 llamar a la función de nube de parse ahora que has desplegado las funciones de nube, podemos llamar a las funciones usando flutter ejemplo 1 llamar a una función de nube y obtener el retorno 1 //executes a cloud function with no parameters that returns a map object 2 final parsecloudfunction function = parsecloudfunction('hello'); 3 final parseresponse parseresponse = await function execute(); 4 if (parseresponse success && parseresponse result != null) { 5 print(parseresponse result); 6 } el resultado mostrado en la consola será ejemplo 2 llamar a una función en la nube con parámetros y obtener el retorno 1 //executes a cloud function with parameters that returns a map object 2 final parsecloudfunction function = parsecloudfunction('sumnumbers'); 3 final map\<string, dynamic> params = \<string, dynamic>{ 4 'number1' 10, 5 'number2' 20 6 }; 7 final parseresponse parseresponse = 8 await function execute(parameters params); 9 if (parseresponse success) { 10 print(parseresponse result); 11 } el resultado mostrado en la consola será ejemplo 2 1 llamar a una función en la nube con parámetros y obtener el retorno 1 //executes a cloud function with parameters that returns a map object 2 final parsecloudfunction function = parsecloudfunction('sumnumbers'); 3 final map\<string, dynamic> params = \<string, dynamic>{ 4 'number1' 10, 5 'number2' 20 6 }; 7 final parseresponse parseresponse = 8 await function execute(parameters params); 9 if (parseresponse success) { 10 print(parseresponse result); 11 } ejemplo 3 llamar a una función en la nube con parámetros y obtener parseobject como retorno 1 //executes a cloud function that returns a parseobject type 2 final parsecloudfunction function = parsecloudfunction('createtodo'); 3 final map\<string, dynamic> params = \<string, dynamic>{ 4 'title' 'task 1', 5 'done' false 6 }; 7 final parseresponse parseresponse = 8 await function executeobjectfunction\<parseobject>(parameters params); 9 if (parseresponse success && parseresponse result != null) { 10 if (parseresponse result\['result'] is parseobject) { 11 //transforms the return into a parseobject 12 final parseobject parseobject = parseresponse result\['result']; 13 print(parseobject objectid); 14 } 15 } el resultado mostrado en la consola será ejemplo 4 llamar a una función en la nube que devuelve una lista de mapas que se pueden convertir en un parseobject 1 //executes a cloud function with parameters that returns a map object 2 final parsecloudfunction function = parsecloudfunction('getlisttodo'); 3 final parseresponse parseresponse = await function execute(); 4 if (parseresponse success) { 5 if (parseresponse result != null) { 6 for (final todo in parseresponse result) { 7 //use fromjson method to convert map in parseobject 8 print(parseobject('todo') fromjson(todo)); 9 } 10 } 11 } el resultado mostrado en la consola será 1 flutter {"classname" "todo","objectid" "cr3g4rcct1","createdat" "2021 06 23t03 20 34 933z","updatedat" "2021 06 23t03 20 34 933z","title" "task 1","done"\ false} 2 flutter {"classname" "todo","objectid" "6barcicpke","createdat" "2021 06 23t03 20 54 294z","updatedat" "2021 06 23t03 20 54 294z","title" "task 1","done"\ false} 3 flutter {"classname" "todo","objectid" "tyza74l89q","createdat" "2021 06 23t03 39 42 049z","updatedat" "2021 06 23t03 39 42 049z","title" "task 1","done"\ false} 4 flutter {"classname" "todo","objectid" "arjm8q7h8d","createdat" "2021 06 24t03 33 27 925z","updatedat" "2021 06 24t03 33 27 925z","title" "task 1","done"\ false} 5 llamar a la función en la nube desde flutter ahora usemos nuestra llamada de ejemplo a la función en la aplicación flutter, con una interfaz simple abre tu proyecto flutter, ve al main dart main dart archivo, limpia todo el código y reemplázalo con 1 import 'package\ flutter/cupertino dart'; 2 import 'package\ flutter/material dart'; 3 import 'package\ parse server sdk flutter/parse server sdk dart'; 4 5 void main() async { 6 widgetsflutterbinding ensureinitialized(); 7 8 final keyapplicationid = 'your app id here'; 9 final keyclientkey = 'your client key here'; 10 11 final keyparseserverurl = 'https //parseapi back4app com'; 12 13 await parse() initialize(keyapplicationid, keyparseserverurl, 14 clientkey keyclientkey, debug true); 15 16 runapp(materialapp( 17 title 'flutter geopoint', 18 debugshowcheckedmodebanner false, 19 home homepage(), 20 )); 21 } 22 23 class homepage extends statefulwidget { 24 @override 25 homepagestate createstate() => homepagestate(); 26 } 27 28 class homepagestate extends state\<homepage> { 29 30 void docallcloudcodehello() async { 31 //executes a cloud function with no parameters that returns a map object 32 final parsecloudfunction function = parsecloudfunction('hello'); 33 final parseresponse parseresponse = await function execute(); 34 if (parseresponse success && parseresponse result != null) { 35 print(parseresponse result); 36 } 37 } 38 39 void docallcloudcodesumnumbers() async { 40 //executes a cloud function with parameters that returns a map object 41 final parsecloudfunction function = parsecloudfunction('sumnumbers'); 42 final map\<string, dynamic> params = \<string, dynamic>{ 43 'number1' 10, 44 'number2' 20 45 }; 46 final parseresponse parseresponse = 47 await function execute(parameters params); 48 if (parseresponse success) { 49 print(parseresponse result); 50 } 51 } 52 53 void docallcloudcodecreatetodo() async { 54 //executes a cloud function that returns a parseobject type 55 final parsecloudfunction function = parsecloudfunction('createtodo'); 56 final map\<string, dynamic> params = \<string, dynamic>{ 57 'title' 'task 1', 58 'done' false 59 }; 60 final parseresponse parseresponse = 61 await function executeobjectfunction\<parseobject>(parameters params); 62 if (parseresponse success && parseresponse result != null) { 63 if (parseresponse result\['result'] is parseobject) { 64 //transforms the return into a parseobject 65 final parseobject parseobject = parseresponse result\['result']; 66 print(parseobject tostring()); 67 } 68 } 69 } 70 71 void docallcloudcodegetlisttodo() async { 72 //executes a cloud function with parameters that returns a map object 73 final parsecloudfunction function = parsecloudfunction('getlisttodo'); 74 final parseresponse parseresponse = await function execute(); 75 if (parseresponse success) { 76 if (parseresponse result != null) { 77 for (final todo in parseresponse result) { 78 //use fromjson method to convert map in parseobject 79 print(parseobject('todo') fromjson(todo)); 80 } 81 } 82 } 83 } 84 85 @override 86 widget build(buildcontext context) { 87 return scaffold( 88 body padding( 89 padding const edgeinsets all(16 0), 90 child column( 91 crossaxisalignment crossaxisalignment stretch, 92 children \[ 93 container( 94 height 200, 95 child image network( 96 'https //blog back4app com/wp content/uploads/2017/11/logo b4a 1 768x175 1 png'), 97 ), 98 center( 99 child const text('flutter on back4app call clode code', 100 style textstyle(fontsize 18, fontweight fontweight bold)), 101 ), 102 sizedbox( 103 height 8, 104 ), 105 container( 106 height 50, 107 child elevatedbutton( 108 onpressed docallcloudcodehello, 109 child text('cloud code hello'), 110 style elevatedbutton stylefrom(primary colors blue)), 111 ), 112 sizedbox( 113 height 8, 114 ), 115 container( 116 height 50, 117 child elevatedbutton( 118 onpressed docallcloudcodesumnumbers, 119 child text('cloud code sumnumber'), 120 style elevatedbutton stylefrom(primary colors blue)), 121 ), 122 sizedbox( 123 height 8, 124 ), 125 container( 126 height 50, 127 child elevatedbutton( 128 onpressed docallcloudcodecreatetodo, 129 child text('cloud code createtodo'), 130 style elevatedbutton stylefrom(primary colors blue)), 131 ), 132 sizedbox( 133 height 8, 134 ), 135 container( 136 height 50, 137 child elevatedbutton( 138 onpressed docallcloudcodegetlisttodo, 139 child text('cloud code getlisttodo'), 140 style elevatedbutton stylefrom(primary colors blue)), 141 ), 142 ], 143 ), 144 )); 145 } 146 } 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 https //www back4app com/ actualiza tu código en main dart main dart con los valores de applicationid y clientkey de tu proyecto en back4app keyapplicationid = id de aplicación id de aplicación keyclientkey = clave de cliente clave de cliente ejecuta el proyecto, y la aplicación se cargará como se muestra en la imagen conclusión en esta etapa, ¡eres capaz de codificar y llamar tu propio código en la nube en tu aplicación flutter utilizando las características del servidor parse a través de back4app!