การใช้ฟังก์ชัน Parse Cloud Code ในแอป Flutter

การใช้ cloud functions ในแอป flutter บทนำ สำหรับแอปที่ซับซ้อน บางครั้งคุณแค่ต้องการตรรกะเล็กน้อยที่ไม่ได้ทำงานบนอุปกรณ์มือถือ cloud code ทำให้สิ่งนี้เป็นไปได้ cloud code ใช้งานง่ายเพราะสร้างขึ้นจาก parse javascript sdk เดียวกันที่ขับเคลื่อนแอปหลายพันแอป ความแตกต่างเพียงอย่างเดียวคือโค้ดนี้ทำงานใน parse server ของคุณแทนที่จะทำงานบนอุปกรณ์มือถือของผู้ใช้ คุณสามารถใช้ cloud code เพื่อถ่ายโอนการประมวลผลไปยังเซิร์ฟเวอร์ parse ซึ่งจะเพิ่มประสิทธิภาพที่รับรู้ของแอปของคุณ คุณสามารถสร้าง hooks ที่ทำงานเมื่อใดก็ตามที่มีการบันทึกหรือลบวัตถุ นี่มีประโยชน์หากคุณต้องการตรวจสอบหรือทำความสะอาดข้อมูลของคุณ คุณยังสามารถใช้ cloud code เพื่อปรับเปลี่ยนวัตถุที่เกี่ยวข้องหรือเริ่มกระบวนการอื่น ๆ เช่นการส่งการแจ้งเตือนแบบพุช เมื่อคุณอัปเดต cloud code ของคุณ มันจะพร้อมใช้งานในทุกสภาพแวดล้อมมือถือทันที คุณไม่ต้องรอการปล่อยใหม่ของแอปพลิเคชันของคุณ สิ่งนี้ช่วยให้คุณเปลี่ยนพฤติกรรมของแอปได้อย่างรวดเร็วและเพิ่มฟีเจอร์ใหม่ได้เร็วขึ้น ส่วนนี้อธิบายวิธีการสร้างและปรับใช้ cloud code ตามด้วยวิธีการเรียกใช้ฟังก์ชันคลาวด์ในโครงการ flutter ผ่าน back4app ในคู่มือนี้ มุ่งเน้นไปที่การแสดงการใช้ cloud function ผ่าน flutter คุณสามารถหาข้อมูลเชิงลึกเพิ่มเติมได้ที่ เอกสาร cloud code อย่างเป็นทางการของ parse ข้อกำหนดเบื้องต้น ในการทำตามบทเรียนนี้ คุณจะต้องมี flutter เวอร์ชัน 2 2 x หรือใหม่กว่า https //flutter dev/docs/get started/install android studio https //developer android com/studio หรือ vs code ที่ติดตั้งแล้ว (พร้อมกับ ปลั๊กอิน dart และ flutter) แอป ที่สร้างขึ้น บน back4app หมายเหตุ ติดตาม บทเรียนการสร้าง parse app ใหม่ เพื่อเรียนรู้วิธีการสร้าง parse app บน back4app แอป flutter ที่เชื่อมต่อกับ back4app หมายเหตุ ติดตาม ติดตั้ง parse sdk บนโปรเจกต์ flutter เพื่อสร้างโปรเจกต์ flutter ที่เชื่อมต่อกับ back4app อุปกรณ์ (หรืออุปกรณ์เสมือน) ที่รัน android หรือ ios เป้าหมาย เรียกใช้ parse cloud code บน back4app จากแอป flutter 1 สร้างไฟล์ cloud code ไปที่แอปของคุณที่ เว็บไซต์ back4app https //www back4app com/ และคลิกที่ การตั้งค่าเซิร์ฟเวอร์ การตั้งค่าเซิร์ฟเวอร์ ค้นหา cloud code cloud code และคลิกที่ ฟังก์ชัน & โฮสติ้งเว็บ ฟังก์ชัน & โฮสติ้งเว็บ มันดูเหมือนแบบนี้ 3\ อัปโหลดหรือสร้างไฟล์ใหม่ (คุณยังสามารถแก้ไขไฟล์ปัจจุบัน main js main js โดยตรงในเบราว์เซอร์) จากนั้นคลิกที่ deploy deploy ตามที่แสดงที่นี่ ไฟล์ของคุณควรมีลักษณะดังนี้ main js main js 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 }); คุณส่งพารามิเตอร์ไปยังฟังก์ชัน cloud ของคุณจากแอป flutter ของคุณและเข้าถึงภายใน request params request params อ็อบเจ็กต์ 2 การเข้าใจคลาส parsecloudfunction คลาส parsecloudfunction parsecloudfunction กำหนดวิธีการสำหรับการโต้ตอบกับ parse cloud functions ฟังก์ชัน cloud สามารถเรียกใช้ได้ด้วย parsecloudfunction execute({parameters params}) parsecloudfunction execute({parameters params}) ซึ่งจะคืนค่าเป็นวัตถุแผนที่หรือ parsecloudfunction executeobjectfunction<>({parameters params}) parsecloudfunction executeobjectfunction<>({parameters params}) ซึ่งจะคืนค่าเป็น parseobject พารามิเตอร์เป็นสิ่งที่ไม่บังคับและคาดว่าจะได้รับวัตถุแผนที่ 3 เรียกใช้ฟังก์ชัน parse cloud ตอนนี้คุณได้ปรับใช้ฟังก์ชัน cloud แล้ว เราสามารถเรียกใช้ฟังก์ชันเหล่านี้โดยใช้ flutter ตัวอย่างที่ 1 เรียกใช้ฟังก์ชัน cloud และรับค่าที่ส่งกลับ 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 } ผลลัพธ์ที่แสดงในคอนโซลจะเป็น ตัวอย่าง 2 เรียกใช้ฟังก์ชันคลาวด์พร้อมพารามิเตอร์และรับค่าผลลัพธ์ 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 } ผลลัพธ์ที่แสดงในคอนโซลจะเป็น ตัวอย่าง 2 1 เรียกใช้ฟังก์ชันคลาวด์พร้อมพารามิเตอร์และรับค่าผลลัพธ์ 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 } ตัวอย่างที่ 3 เรียกใช้ฟังก์ชันคลาวด์ด้วยพารามิเตอร์และรับ parseobject กลับมา 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 } ผลลัพธ์ที่แสดงในคอนโซลจะเป็น ตัวอย่างที่ 4 เรียกใช้ฟังก์ชันคลาวด์ที่ส่งคืนรายการของแผนที่ที่สามารถแปลงเป็น 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 } ผลลัพธ์ที่แสดงในคอนโซลจะเป็น 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 เรียกใช้ฟังก์ชันคลาวด์จาก flutter ตอนนี้เรามาใช้ตัวอย่างการเรียก cloud function ในแอป flutter ของเรากัน โดยมีอินเทอร์เฟซที่เรียบง่าย เปิดโปรเจกต์ flutter ของคุณ ไปที่ main dart main dart ไฟล์ ทำความสะอาดโค้ดทั้งหมด และแทนที่ด้วย 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 } ค้นหา application id และ client key ของคุณโดยไปที่แดชบอร์ดแอปของคุณที่ เว็บไซต์ back4app https //www back4app com/ อัปเดตโค้ดของคุณใน main dart main dart ด้วยค่าของ applicationid และ clientkey ของโปรเจกต์ของคุณใน back4app keyapplicationid = app id app id keyclientkey = client key client key เรียกใช้โปรเจกต์ และแอปจะโหลดตามที่แสดงในภาพ บทสรุป ในขั้นตอนนี้ คุณสามารถเขียนโค้ดและเรียกใช้ cloud code ของคุณในแอป flutter ของคุณโดยใช้ฟีเจอร์ของ parse server core ผ่าน back4app!