Flutter
Parse SDK (REST)
Cloud Code Functions
18 min
using cloud functions in a flutter app introduction for complex apps, sometimes you just need a bit of logic that isn’t running on a mobile device cloud code makes this possible cloud code is easy to use because it’s built on the same parse javascript sdk that powers thousands of apps the only difference is that this code runs in your parse server rather than running on the user’s mobile device you can use cloud code to offload processing to the parse servers thus increasing your app’s perceived performance you can create hooks that run whenever an object is saved or deleted this is useful if you want to validate or sanitize your data you can also use cloud code to modify related objects or kick off other processes such as sending off a push notification when you update your cloud code, it becomes available to all mobile environments instantly you don’t have to wait for a new release of your application this lets you change app behavior on the fly and add new features faster this section explains how to create and deploy cloud code, followed by how to call a cloud function in flutter projects through back4app in this guide, the focus is to demonstrate the use of cloud function through flutter you can find more in depth information in parse official cloud code documentation prerequisites to complete this tutorial, you will need flutter version 2 2 x or later https //flutter dev/docs/get started/install android studio https //developer android com/studio or vs code installed (with plugins dart and flutter) an app created on back4app note follow the new parse app tutorial to learn how to create a parse app on back4app an flutter app connected to back4app note follow the install parse sdk on flutter project to create an flutter project connected to back4app a device (or virtual device) running android or ios goal run parse cloud code on back4app from a flutter app 1 create a cloud code file go to your app at back4app website https //www back4app com/ and click on server settings server settings find the cloud code cloud code and click on functions & web hosting functions & web hosting it looks like this 3\ upload or create a new file (you can also edit the current main js main js file directly on the browser) then, click at deploy deploy as shown here your main js main js file should look like this 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 }); you pass parameters to your cloud function from your flutter app and access then within the request params request params object 2 understanding the parsecloudfunction class the parsecloudfunction parsecloudfunction class defines provides methods for interacting with parse cloud functions a cloud function can be called with parsecloudfunction execute({parameters params}) parsecloudfunction execute({parameters params}) that returns a map object or parsecloudfunction executeobjectfunction<>({parameters params}) parsecloudfunction executeobjectfunction<>({parameters params}) that returns a parseobject parameters are optional and a map object is expected 3 call parse cloud function now that you have deployed the cloud functions, we can call the functions using flutter example 1 call a cloud function and get the return 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 } the result displayed in the console will be example 2 call a cloud function with parameters and get the return 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 } the result displayed in the console will be example 2 1 call a cloud function with parameters and get the return 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 } example 3 call a cloud function with parameters and get parseobject on return 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 } the result displayed in the console will be example 4 call a cloud function that returns a list of maps that can be converted to a 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 } the result displayed in the console will be 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 call cloud function from flutter let’s now use our example call cloud function in flutter app, with a simple interface open your flutter project, go to the main dart main dart file, clean up all the code, and replace it with 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 } find your application id and client key credentials navigating to your app dashboard at back4app website https //www back4app com/ update your code in main dart main dart with the values of your project’s applicationid and clientkey in back4app keyapplicationid = app id app id keyclientkey = client key client key run the project, and the app will load as shown in the image conclusion at this stage, you are able to code and call your own cloud code in your flutter app using parse server core features through back4app!