Panduan Login/Logout Pengguna di Flutter dengan Parse SDK

login dan logout pengguna untuk flutter menggunakan parse server pendahuluan setelah menerapkan pendaftaran pengguna untuk flutter di parse pada panduan terakhir, anda akan belajar bagaimana cara login dan logout pengguna menggunakan kelas parseuser yang sama setelah pendaftaran, operasi login dilakukan secara otomatis, dan sesi pengguna baru dibuat operasi logout menghapus objek sesi aktif untuk pengguna yang telah login dalam panduan ini, anda akan belajar bagaimana menggunakan plugin flutter untuk parse server untuk melakukan login/logout menggunakan kelas parseuser untuk aplikasi flutter anda tujuan untuk membangun fitur login/logout 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 selesaikan panduan sebelumnya agar anda dapat memiliki pemahaman yang lebih baik tentang parseuser parseuser kelas sebuah perangkat (atau perangkat virtual) yang menjalankan android atau ios memahami aplikasi login/logout untuk lebih memahami proses login/keluar, kami akan membuat aplikasi untuk masuk dan keluar pengguna dari 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 login dan logout di database back4app mari kita mulai! dalam langkah langkah berikut, anda akan dapat membangun aplikasi login/logout 1 buat template aplikasi login/logout buka proyek flutter anda dari panduan sebelumnya flutter plugin untuk parse server pergi ke main dart main dart file, 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 login/logout', 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 bool isloggedin = false; 40 41 @override 42 widget build(buildcontext context) { 43 return scaffold( 44 appbar appbar( 45 title const text('flutter login/logout'), 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 login/logout', 68 style textstyle(fontsize 16)), 69 ), 70 sizedbox( 71 height 16, 72 ), 73 textfield( 74 controller controllerusername, 75 enabled !isloggedin, 76 keyboardtype textinputtype text, 77 textcapitalization textcapitalization none, 78 autocorrect false, 79 decoration inputdecoration( 80 border outlineinputborder( 81 borderside borderside(color colors black)), 82 labeltext 'username'), 83 ), 84 sizedbox( 85 height 8, 86 ), 87 textfield( 88 controller controllerpassword, 89 enabled !isloggedin, 90 obscuretext true, 91 keyboardtype textinputtype text, 92 textcapitalization textcapitalization none, 93 autocorrect false, 94 decoration inputdecoration( 95 border outlineinputborder( 96 borderside borderside(color colors black)), 97 labeltext 'password'), 98 ), 99 sizedbox( 100 height 16, 101 ), 102 container( 103 height 50, 104 child textbutton( 105 child const text('login'), 106 onpressed isloggedin ? null () => douserlogin(), 107 ), 108 ), 109 sizedbox( 110 height 16, 111 ), 112 container( 113 height 50, 114 child textbutton( 115 child const text('logout'), 116 onpressed !isloggedin ? null () => douserlogout(), 117 ), 118 ) 119 ], 120 ), 121 ), 122 )); 123 } 124 125 void showsuccess(string message) { 126 showdialog( 127 context context, 128 builder (buildcontext context) { 129 return alertdialog( 130 title const text("success!"), 131 content text(message), 132 actions \<widget>\[ 133 new textbutton( 134 child const text("ok"), 135 onpressed () { 136 navigator of(context) pop(); 137 }, 138 ), 139 ], 140 ); 141 }, 142 ); 143 } 144 145 void showerror(string errormessage) { 146 showdialog( 147 context context, 148 builder (buildcontext context) { 149 return alertdialog( 150 title const text("error!"), 151 content text(errormessage), 152 actions \<widget>\[ 153 new textbutton( 154 child const text("ok"), 155 onpressed () { 156 navigator of(context) pop(); 157 }, 158 ), 159 ], 160 ); 161 }, 162 ); 163 } 164 165 void douserlogin() async { 166 167 } 168 169 void douserlogout() async { 170 171 } 172 } 173 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 di 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 login pengguna fungsi login pengguna membuat sebuah sesi sesi objek, yang menunjuk ke pengguna pengguna yang masuk dan menyimpan di penyimpanan lokal anda sesi pengguna yang valid panggilan mendatang ke metode seperti currentuser currentuser akan berhasil mengambil data pengguna data pengguna anda dan sessiontoken sessiontoken untuk objek sesi sesi yang dibuat di dasbor dasbor cari fungsi douserlogin douserlogin di file main dart main dart ganti kode di dalam douserlogin douserlogin dengan 1 final username = controllerusername text trim(); 2 final password = controllerpassword text trim(); 3 4 final user = parseuser(username, password, null); 5 6 var response = await user login(); 7 8 if (response success) { 9 showsuccess("user was successfully login!"); 10 setstate(() { 11 isloggedin = true; 12 }); 13 } else { 14 showerror(response error! message); 15 } untuk membangun fungsi ini, ikuti langkah langkah berikut buat sebuah parseuser parseuser instance kelas dengan perintah parseuser(username, password, null); parseuser(username, password, null); menggunakan data yang dimasukkan di aplikasi kolom e mail tidak diperlukan dan harus diisi dengan null panggil login login fungsi, yang akan membuat sebuah session session di database anda di parse dashboard dan simpan token ke penyimpanan lokal periksa apakah login pengguna berhasil jika tidak berhasil, tampilkan pesan deskripsi kesalahan fungsi lengkapnya harus terlihat seperti ini 1 void douserlogin() async { 2 final username = controllerusername text trim(); 3 final password = controllerpassword text trim(); 4 5 final user = parseuser(username, password, null); 6 7 var response = await user login(); 8 9 if (response success) { 10 showsuccess("user was successfully login!"); 11 setstate(() { 12 isloggedin = true; 13 }); 14 } else { 15 showerror(response error! message); 16 } 17 } untuk mengujinya, klik pada tombol run run di android studio/vscode setelah memberikan kredensial pengguna yang diinginkan, anda akan melihat pesan ini setelah menekan login jika semuanya berhasil penanganan kesalahan dapat diuji jika anda mencoba untuk masuk sebagai pengguna dengan kredensial yang tidak valid anda akan mendapatkan kesalahan lain jika anda mencoba untuk masuk tanpa kata sandi 4 kode untuk logout pengguna fungsi logout pengguna menghapus sesi sesi objek, yang dibuat dalam fungsi login ini akan membersihkan sesi ini di perangkat dan keluar dari layanan yang terhubung di server parse anda cari fungsi douserlogout douserlogout di file main dart main dart ganti kode di dalam douserlogout douserlogout dengan 1 final user = await parseuser currentuser() as parseuser; 2 var response = await user logout(); 3 4 if (response success) { 5 showsuccess("user was successfully logout!"); 6 setstate(() { 7 isloggedin = false; 8 }); 9 } else { 10 showerror(response error! message); 11 } untuk membangun fungsi ini, ikuti langkah langkah berikut dapatkan pengguna yang sedang masuk menggunakan fungsi parseuser currentuser() parseuser currentuser() panggil fungsi logout logout untuk objek parseuser parseuser yang akan menghapus session session di database anda dan membersihkan token di penyimpanan lokal periksa apakah pengguna berhasil keluar jika tidak berhasil, tampilkan pesan deskripsi kesalahan kode lengkapnya harus terlihat seperti ini 1 void douserlogout() async { 2 final user = await parseuser currentuser() as parseuser; 3 var response = await user logout(); 4 5 if (response success) { 6 showsuccess("user was successfully logout!"); 7 setstate(() { 8 isloggedin = false; 9 }); 10 } else { 11 showerror(response error! message); 12 } 13 } untuk mengujinya, klik tombol jalankan jalankan di android studio/vscode setelah memberikan kredensial pengguna yang diinginkan, anda akan melihat pesan ini setelah menekan login jika semuanya berhasil klik tombol “logout” selesai! di akhir panduan ini, anda dapat masuk dan keluar dari pengguna parse aplikasi anda menggunakan fitur inti parse server melalui back4app!