Menggunakan Parse di Flutter untuk Pendaftaran Pengguna

pendaftaran pengguna untuk flutter menggunakan parse server pendahuluan di inti banyak aplikasi, akun pengguna memiliki konsep yang memungkinkan pengguna mengakses informasi mereka dengan aman parse menyediakan kelas pengguna kelas pengguna yang secara otomatis menangani banyak fungsi yang diperlukan untuk manajemen akun pengguna dengan kelas ini, anda akan dapat menambahkan fungsionalitas akun pengguna ke aplikasi anda parseuser parseuser adalah subclass dari parseobject parseobject , dan memiliki fitur yang sama semua metode yang ada di parseobject juga ada di parseuser perbedaannya adalah bahwa parseuser parseuser memiliki beberapa tambahan khusus untuk akun pengguna parseuser parseuser memiliki beberapa properti yang membedakannya dari parseobject username nama pengguna untuk pengguna (diperlukan) password kata sandi untuk pengguna (diperlukan saat mendaftar) email alamat email untuk pengguna (opsional) anda bebas menggunakan alamat email alamat email sebagai nama pengguna nama pengguna minta pengguna anda untuk memasukkan email email , tetapi isi di properti nama pengguna nama pengguna — parseuser akan berfungsi seperti biasa dalam panduan ini, anda akan belajar bagaimana menggunakan plugin flutter untuk parse server untuk mengelola pengguna menggunakan parseuser parseuser kelas untuk membuat fitur pendaftaran pengguna untuk aplikasi flutter anda tujuan untuk membangun fitur pendaftaran pengguna menggunakan parse untuk aplikasi flutter prasyarat untuk menyelesaikan tutorial ini, anda akan membutuhkan https //flutter dev/docs/get started/install https //developer android com/studio atau https //code visualstudio com/ (dengan https //docs flutter dev/get started/editor dart dan flutter) sebuah aplikasi https //www back4app com/docs/get started/new parse app di back4app catatan ikuti https //www back4app com/docs/get started/new parse app untuk belajar cara membuat aplikasi parse di back4app sebuah aplikasi flutter yang terhubung ke back4app catatan ikuti https //www back4app com/docs/flutter/parse sdk/parse flutter sdk untuk membuat proyek flutter yang terhubung ke back4app sebuah perangkat (atau perangkat virtual) yang menjalankan android atau ios memahami aplikasi signup untuk lebih memahami proses signup, kami akan membuat aplikasi untuk mendaftarkan data pengguna dan membuat akun anda kami tidak akan menjelaskan kode aplikasi flutter karena fokus utama panduan ini adalah menggunakan flutter dengan parse mengikuti langkah langkah berikut, anda akan membangun aplikasi todo yang akan menyimpan tugas di database back4app mari kita mulai! mengikuti langkah langkah berikut, anda akan dapat membangun aplikasi sign yang akan membuat akun pengguna di database back4app 1 buat template aplikasi sign buka proyek flutter anda dari panduan sebelumnya plugin flutter untuk parse server pergi ke file main dart main dart , bersihkan semua kode, dan ganti dengan 1 import 'package\ flutter/material dart'; 2 import 'package\ parse server sdk flutter/parse server sdk dart'; 3 4 void main() async { 5 widgetsflutterbinding ensureinitialized(); 6 7 final keyapplicationid = 'your app id here'; 8 final keyclientkey = 'your client key here'; 9 final keyparseserverurl = 'https //parseapi back4app com'; 10 11 await parse() initialize(keyapplicationid, keyparseserverurl, 12 clientkey keyclientkey, debug true); 13 14 runapp(myapp()); 15 } 16 17 class myapp extends statelesswidget { 18 @override 19 widget build(buildcontext context) { 20 return materialapp( 21 title 'flutter signup', 22 theme themedata( 23 primaryswatch colors blue, 24 visualdensity visualdensity adaptiveplatformdensity, 25 ), 26 home homepage(), 27 ); 28 } 29 } 30 31 class homepage extends statefulwidget { 32 @override 33 homepagestate createstate() => homepagestate(); 34 } 35 36 class homepagestate extends state\<homepage> { 37 final controllerusername = texteditingcontroller(); 38 final controllerpassword = texteditingcontroller(); 39 final controlleremail = texteditingcontroller(); 40 41 @override 42 widget build(buildcontext context) { 43 return scaffold( 44 appbar appbar( 45 title const text('flutter signup'), 46 ), 47 body center( 48 child singlechildscrollview( 49 padding const edgeinsets all(8), 50 child column( 51 crossaxisalignment crossaxisalignment stretch, 52 children \[ 53 container( 54 height 200, 55 child image network( 56 'http //blog back4app com/wp content/uploads/2017/11/logo b4a 1 768x175 1 png'), 57 ), 58 center( 59 child const text('flutter on back4app', 60 style 61 textstyle(fontsize 18, fontweight fontweight bold)), 62 ), 63 sizedbox( 64 height 16, 65 ), 66 center( 67 child const text('user registration', 68 style textstyle(fontsize 16)), 69 ), 70 sizedbox( 71 height 16, 72 ), 73 textfield( 74 controller controllerusername, 75 keyboardtype textinputtype text, 76 textcapitalization textcapitalization none, 77 autocorrect false, 78 decoration inputdecoration( 79 border outlineinputborder( 80 borderside borderside(color colors black)), 81 labeltext 'username'), 82 ), 83 sizedbox( 84 height 8, 85 ), 86 textfield( 87 controller controlleremail, 88 keyboardtype textinputtype emailaddress, 89 textcapitalization textcapitalization none, 90 autocorrect false, 91 decoration inputdecoration( 92 border outlineinputborder( 93 borderside borderside(color colors black)), 94 labeltext 'e mail'), 95 ), 96 sizedbox( 97 height 8, 98 ), 99 textfield( 100 controller controllerpassword, 101 obscuretext true, 102 keyboardtype textinputtype text, 103 textcapitalization textcapitalization none, 104 autocorrect false, 105 decoration inputdecoration( 106 border outlineinputborder( 107 borderside borderside(color colors black)), 108 labeltext 'password'), 109 ), 110 sizedbox( 111 height 8, 112 ), 113 container( 114 height 50, 115 child textbutton( 116 child const text('sign up'), 117 onpressed () => douserregistration(), 118 ), 119 ) 120 ], 121 ), 122 ), 123 )); 124 } 125 126 void showsuccess() { 127 showdialog( 128 context context, 129 builder (buildcontext context) { 130 return alertdialog( 131 title const text("success!"), 132 content const text("user was successfully created!"), 133 actions \<widget>\[ 134 new flatbutton( 135 child const text("ok"), 136 onpressed () { 137 navigator of(context) pop(); 138 }, 139 ), 140 ], 141 ); 142 }, 143 ); 144 } 145 146 void showerror(string errormessage) { 147 showdialog( 148 context context, 149 builder (buildcontext context) { 150 return alertdialog( 151 title const text("error!"), 152 content text(errormessage), 153 actions \<widget>\[ 154 new flatbutton( 155 child const text("ok"), 156 onpressed () { 157 navigator of(context) pop(); 158 }, 159 ), 160 ], 161 ); 162 }, 163 ); 164 } 165 166 void douserregistration() async { 167 //sigup code here 168 } 169 } 170 ketika debug debug parameter dalam fungsi parse() initialize parse() initialize adalah true true , memungkinkan menampilkan panggilan api parse di konsol konfigurasi ini dapat membantu dalam debugging kode disarankan untuk menonaktifkan debug dalam versi rilis 2 hubungkan template ke proyek back4app temukan id aplikasi dan kredensial kunci klien anda dengan menavigasi ke dasbor aplikasi anda di https //www back4app com/ perbarui kode anda di main dart main dart dengan nilai applicationid dan clientkey proyek anda di back4app keyapplicationid = id aplikasi keyclientkey = kunci klien jalankan proyek, dan aplikasi akan dimuat seperti yang ditunjukkan dalam gambar 3 kode untuk mendaftar pengguna fungsi pendaftaran pengguna membuat pengguna baru di aplikasi parse anda sebelum itu, ia memeriksa untuk memastikan bahwa baik nama pengguna maupun email adalah unik jika pendaftaran tidak berhasil, anda harus memeriksa objek kesalahan yang dikembalikan penyebab yang paling mungkin adalah bahwa pengguna lain telah mengambil nama pengguna atau email tersebut anda harus mengkomunikasikan ini kepada pengguna anda dan meminta mereka untuk mencoba nama pengguna yang berbeda cari fungsi douserregistration douserregistration di file main dart main dart ganti kode di dalam douserregistration douserregistration dengan 1 final username = controllerusername text trim(); 2 final email = controlleremail text trim(); 3 final password = controllerpassword text trim(); 4 5 final user = parseuser createuser(username, password, email); 6 7 var response = await user signup(); 8 9 if (response success) { 10 showsuccess(); 11 } else { 12 showerror(response error! message); 13 } untuk membangun fungsi ini, ikuti langkah langkah berikut buat instance baru dari parseuser parseuser kelas dengan perintah parseuser createuser(username, password, email) parseuser createuser(username, password, email) , dengan data yang diisi di aplikasi panggil signup signup fungsi, yang akan mendaftarkan pengguna ke database anda di parse dashboard periksa apakah pengguna berhasil mendaftar jika tidak berhasil, tampilkan pesan deskripsi kesalahan kode lengkapnya harus terlihat seperti ini 1 void douserregistration() async { 2 final username = controllerusername text trim(); 3 final email = controlleremail text trim(); 4 final password = controllerpassword text trim(); 5 6 final user = parseuser createuser(username, password, email); 7 8 var response = await user signup(); 9 10 if (response success) { 11 showsuccess(); 12 } else { 13 showerror(response error! message); 14 } 15 } untuk mengujinya, klik tombol jalankan jalankan di android studio/vscode setelah memberikan kredensial pengguna yang diinginkan, anda akan melihat pesan ini setelah menekan daftar jika semuanya berhasil penanganan kesalahan dapat diuji jika anda mencoba mendaftar pengguna dengan nama pengguna yang sama seperti sebelumnya anda akan mendapatkan kesalahan lain jika anda mencoba mendaftar tanpa kata sandi 4 periksa pendaftaran pengguna di dasbor masuk di https //www back4app com/ temukan aplikasi anda dan klik dasbor dasbor > inti inti > peramban peramban > pengguna pengguna pada titik ini, anda harus melihat pengguna anda seperti yang ditampilkan di bawah selesai! di akhir panduan ini, anda telah belajar bagaimana mendaftarkan pengguna parse baru di flutter di panduan berikutnya, kami akan menunjukkan kepada anda cara masuk dan keluar pengguna