Регистрация пользователя в Parse с Flutter: Техническое руководство

регистрация пользователя для flutter с использованием parse server введение в основе многих приложений лежат учетные записи пользователей, которые позволяют пользователям безопасно получать доступ к своей информации parse предоставляет специализированный класс user класс user , который автоматически обрабатывает большую часть функциональности, необходимой для управления учетными записями пользователей с помощью этого класса вы сможете добавить функциональность учетной записи пользователя в ваше приложение parseuser parseuser является подклассом parseobject parseobject , и имеет те же функции все методы, которые есть в parseobject, также существуют в parseuser разница в том, что parseuser parseuser имеет некоторые специальные дополнения, специфичные для учетных записей пользователей parseuser parseuser имеет несколько свойств, которые отличают его от parseobject имя пользователя имя пользователя (обязательно) пароль пароль для пользователя (обязательно при регистрации) электронная почта адрес электронной почты пользователя (необязательно) вы можете использовать адрес электронной почты адрес электронной почты в качестве имени пользователя имени пользователя попросите ваших пользователей ввести их электронную почту электронную почту , но заполните это в свойстве имя пользователя имя пользователя , — parseuser будет работать как обычно в этом руководстве вы узнаете, как использовать плагин flutter для parse server для управления пользователями с помощью класса parseuser 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 приложения чтобы узнать, как создать приложение parse на back4app приложение flutter, подключенное к back4app примечание следуйте установите parse sdk в проект flutter чтобы создать проект flutter, подключенный к back4app устройство (или виртуальное устройство), работающее на android или ios понимание приложения signup чтобы лучше понять процесс регистрации, мы создадим приложение для регистрации данных пользователей и создания вашей учетной записи мы не будем объяснять код приложения flutter, так как основное внимание в этом руководстве уделяется использованию flutter с parse следуя следующим шагам, вы создадите приложение todo, которое будет хранить задачи в базе данных back4app давайте начнем! следуя следующим шагам, вы сможете создать приложение sign, которое создаст учетную запись пользователя в базе данных back4app 1 создайте шаблон приложения sign откройте ваш проект 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 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 когда отладка отладка параметр в функции 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 код для регистрации пользователя функция регистрации пользователя создает нового пользователя в вашем приложении parse перед этим она проверяет, чтобы имя пользователя и электронная почта были уникальными если регистрация не удалась, вам следует проверить объект ошибки, который возвращается наиболее вероятная причина в том, что другое лицо уже заняло имя пользователя или электронную почту вам следует сообщить об этом вашим пользователям и попросить их попробовать другое имя пользователя найдите функцию douserregistration douserregistration в файле main dart main dart замените код внутри douserregistration douserregistration на 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 } чтобы создать эту функцию, выполните следующие шаги создайте новый экземпляр класса parseuser parseuser с помощью команды parseuser createuser(username, password, email) parseuser createuser(username, password, email) , с данными, которые были заполнены в приложении вызовите функцию signup signup , которая зарегистрирует пользователя в вашей базе данных в parse dashboard проверьте, успешно ли зарегистрировался пользователь если нет, покажите сообщение об ошибке полный код должен выглядеть так 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 } чтобы протестировать это, нажмите на кнопку запуск запуск в android studio/vscode после ввода желаемых учетных данных пользователя вы увидите это сообщение после нажатия на регистрация, если все прошло успешно обработку ошибок можно протестировать, если вы попытаетесь зарегистрировать пользователя с тем же именем пользователя, что и раньше вы получите другую ошибку, если попытаетесь зарегистрироваться без пароля 4 проверьте регистрацию пользователя на панели управления войдите на сайт back4app https //www back4app com/ найдите свое приложение и нажмите на панель управления панель управления > ядро ядро > браузер браузер > пользователь пользователь на этом этапе вы должны увидеть своего пользователя, как показано ниже готово! в конце этого руководства вы узнали, как регистрировать новых пользователей parse на flutter в следующем руководстве мы покажем вам, как входить и выходить из системы