Flutter
...
Authentication
Аутентификация пользователей в Flutter с сервером Parse
15 мин
вход и выход пользователя для flutter с использованием parse server введение после реализации регистрации пользователя для flutter на parse в последнем руководстве вы узнаете, как входить и выходить из системы, используя тот же класс parseuser после регистрации операция входа выполняется автоматически, и создается новая сессия пользователя операция выхода удаляет активный объект сессии для вошедшего пользователя в этом руководстве вы узнаете, как использовать плагин flutter для parse server для выполнения входа/выхода с использованием класса parseuser для вашего приложения flutter цель создать функцию входа/выхода пользователя с использованием parse для приложения flutter предварительные требования чтобы завершить этот учебник, вам потребуется версия 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 завершите предыдущий гид, чтобы лучше понять класс parseuser parseuser устройство (или виртуальное устройство), работающее на android или ios понимание приложения для входа/выхода чтобы лучше понять процесс входа/выхода, мы создадим приложение для входа и выхода пользователя из вашей учетной записи мы не будем объяснять код приложения flutter, так как основное внимание в этом руководстве уделяется использованию flutter с parse следуя следующим шагам, вы создадите приложение для входа и выхода в базе данных back4app давайте начнем! в следующих шагах вы сможете создать приложение для входа/выхода 1 создайте шаблон приложения для входа/выхода откройте ваш проект flutter из предыдущего руководства flutter plugin for parse server перейдите к файлу main dart main dart , очистите весь код и замените его на 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 когда отладка отладка параметр в функции parse() initialize parse() initialize равен истина истина , это позволяет отображать вызовы parse api в консоли эта конфигурация может помочь в отладке кода рекомендуется отключить отладку в релизной версии 2 подключите шаблон к проекту back4app найдите свои учетные данные application id и client key, перейдя на панель управления вашего приложения по адресу сайт back4app https //www back4app com/ обновите свой код в main dart main dart с значениями applicationid и clientkey вашего проекта в back4app keyapplicationid = app id keyclientkey = client key запустите проект, и приложение загрузится, как показано на изображении 3 код для входа пользователя функция входа пользователя создает сессию сессию объект, который указывает на пользователя пользователя вошедшего в систему и сохраняет в вашем локальном хранилище действительную сессию пользователя будущие вызовы методов, таких как currentuser currentuser успешно получат ваши данные пользователя данные пользователя и sessiontoken sessiontoken для сессии сессии объекта, который был создан в панели управления панели управления ищите функцию douserlogin douserlogin в файле main dart main dart замените код внутри douserlogin douserlogin на 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 } чтобы создать эту функцию, выполните следующие шаги создайте новый parseuser parseuser экземпляр класса с командой parseuser(username, password, null); parseuser(username, password, null); с использованием данных, введенных в приложении поле электронной почты не обязательно и должно быть указано как null вызовите функцию login login , которая создаст session session в вашей базе данных в parse dashboard и сохранит токен в локальном хранилище проверьте, был ли успешным вход пользователя если вход не удался, отобразите сообщение с описанием ошибки полная функция должна выглядеть так 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 } чтобы протестировать это, нажмите на кнопку запуск запуск в android studio/vscode после ввода желаемых учетных данных пользователя вы увидите это сообщение после нажатия на вход, если все прошло успешно обработку ошибок можно протестировать, если вы попытаетесь войти в систему с недействительными учетными данными вы получите другую ошибку, если попытаетесь войти без пароля 4 код для выхода пользователя функция выхода пользователя удаляет сессию сессию , которая была создана в функции входа она очистит эту сессию на устройстве и выйдет из любых связанных сервисов на вашем сервере parse ищите функцию douserlogout douserlogout в файле main dart main dart замените код внутри douserlogout douserlogout на 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 } чтобы создать эту функцию, выполните следующие шаги получите текущего вошедшего пользователя, используя функцию parseuser currentuser() parseuser currentuser() вызовите функцию logout logout для объекта parseuser parseuser , которая удалит сессию сессию в вашей базе данных и очистит токен в локальном хранилище проверьте, был ли выход пользователя успешным если это не так, покажите сообщение об ошибке полный код должен выглядеть так 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 } чтобы протестировать это, нажмите на кнопку запуск запуск в android studio/vscode после ввода желаемых учетных данных пользователя вы увидите это сообщение после нажатия на войти, если все прошло успешно нажмите кнопку “выйти” готово! в конце этого руководства вы сможете войти и выйти из учетных записей пользователей parse вашего приложения, используя основные функции parse server через back4app!