استفاده از احراز هویت فایربیس با فلاتر – از صفر تا صد


در این مقاله شیوه ایجاد یک اپلیکیشن با فلاتر را شرح داده و اتصال آن به سیستم احراز هویت فایربیس را مورد بررسی قرار میدهیم. قصد ما این است که با فایربیس تعامل پیدا کنیم تا هویت کاربر را احراز کرده و تابعهای دیگری را نیز در فایربیس اجرا کنیم. در این راهنما میتوانید یک اپلیکیشن ساده فلاتر بسازید که در آن کاربر میتواند از طریق اپلیکیشن ثبت نام کرده و در آن لاگین کند. اگر کاربر تمایل داشته باشد، میتواند ایمیل و رمز عبور را تغییر دهد و یا حتی حساب کاربری را حذف کند.
اهداف
اهداف این پروژه شامل موارد زیر هستند:
- پیکربندی فایربیس روی پروژه فلاتر
- ایجاد فرمهای ثبت نام، لاگین و دیگر کارکردها در فایربیس
روش اجرای پروژه
در این بخش و همانطور که از عنوان بر میآید، روش اجرای پروژه را با هم مرور میکنیم.
گام 1
قبل از هر چیز باید یک پروژه فلاتر ایجاد کنیم. اگر نمیدانید چگونه باید پروژه فلاتر ایجاد کنید، میتوانید از این راهنمای مجله فرادرس کمک بگیرید:
پس از ایجاد پروژه فلاتر باید فایربیس را روی پروژه پیکربندی کنیم. در مورد اندروید به کنسول فایربیس بروید و روی دکمه «افزودن اپلیکیشن» (Add App) کلیک کنید تا با انتخاب آیکون اندروید فرمی مانند زیر نمایش یابد:
نام پروژه را اضافه کنید. با باز کردن فایل AndroidManifest در مسیر android/app/src/main/AndroidManifest.xml میتوانید نام پروژه را به دست آورید. پس از آن فایل google-services.json را دانلود کنید. سپس به پروژه بروید و فایل google-services.json را درون پوشه دایرکتوری اندروید یعنی android/app قرار دهید.
باید افزونه Google Services Gradle را نیز برای خواندن فایل Google Services Gradle اضافه کنیم. بنابراین فایل build.gradle را به صورت زیر ویرایش کنید:
پس از پایان یافتن ویرایشها پروژه را همگامسازی (Sync) کنید.
در مورد iOS، برای اجرای Xcode ابتدا ios/Runner.xcworkspace را باز کنید. نام پکیج را میتوانید در شناسه bundle در نمای Runner ببینید. فایل config را که به صورت GoogleService-info.plist است دانلود کنید. این فایل را درون زیرپوشه Runner درون Runner که به صورت زیر است، بکشید:
سپس به کنسول فایربیس بروید و روی دکمه احراز هویت در سمت چپ نوار ناوبری بزنید. سپس ایمیل/رمز عبور را فعال کنید. با این فعالسازی میتوانید کاربران را در فایربیس ثبت نام کنید.
اکنون پیکربندی فایربیس انجام یافته است. کار بعدی که باید انجام دهیم در سطح کد است.
گام 2
در این بخش باید وابستگیها را به پروژه فلاتر خود اضافه کنیم. به این منظور به فایل pubspec.yaml بروید و زیر وابستگیها خط زیر را اضافه کنید:
firebase_auth: ^0.9.0
پروژه را ذخیره کنید.
گام 3
اکنون باید سرویسهایی که به اپلیکیشن موبایل با فایربیس وصل میشوند را بنویسیم. درون پوشه lib یک پوشه جدید به نام Services ایجاد میکنیم. سپس یک فایل dart درون پوشه Services به نام authentication.dart ایجاد کرده و کد زیر را در آن قرار میدهیم:
در کد فوق، یک کلاس به نام BaseAuth ایجاد میکنیم تا متدی که قصد داریم پیادهسازی کنیم را بنویسیم و پارامترها را ارسال کنیم. سپس یک کلاس مجزا به نام Auth ایجاد میکنیم آن را در کلاس BaseAuth پیادهسازی میکنیم به طوری که متدهای الحاق یافته بتوانند در Auth پیادهسازی شوند.
گام 4
در این گام باید صفحههای ثبت نام و لاگین کاربر را طراحی کنیم. یک پوشه درون دایرکتوری lib به نام pages ایجاد کنید. درون پوشه pages یک فایل دارت به نام login_signup_page.dart ایجاد کرده و کد دارت زیر را در آن بنویسید:
در این کد برای هر دو صفحه ثبت نام و ورود، از صفحه یکسانی استفاده کردهایم. اما UI آنها متفاوت است.
سپس یک فایل به نام home_page.dart ایجاد میکنیم. در این صفحه اصلی، فعالیتهای زیر انجام خواهند یافت:
- تغییر رمز عبور کاربر
- تغییر ایمیل کاربر
- ارسال ایمیل تأیید حساب به کاربر
- حذف کاربر
- خروج از حساب کاربری
سپس یک صفحه به نام root_page.dart ایجاد کرده و کد زیر را در آن قرار میدهیم:
در این کد تصمیمگیری میشود که در زمان بارگذاری اپلیکیشن کدام صفحه باید بارگذاری شود. اگر کاربر ورود کرده باشد، به صفحه ورود هدایت میشود. در غیر این صورت اگر کاربر از قبل احراز هویت شده باشد، به صفحه اصلی هدایت خواهد شد.
در نهایت فایل main.dart را به صورت زیر تغییر میدهیم:
اکنون میتوانید اپلیکیشن را با اجرای دستور flutter run روی ترمینال باز کنید.
سخن پایانی
در این راهنما با شیوه استفاده از فایربیس برای لاگین کاربران از طریق اپلیکیشنهای موبایل و اجرای کارکردهای دیگر در فایربیس آشنا شدیم. بدین ترتیب میتوانید یک اپلیکیشن احراز هویت با استفاده از فایربیس ایجاد کنید. اگر در هر مرحله از اجرای اپلیکیشن با مشکل مواجه شدید، میتوانید کد کامل این پروژه را در این ریپوی گیتهاب (+) ملاحظه کنید.
اگر این مطلب برای شما مفید بوده است، آموزشهای زیر نیز به شما پیشنهاد میشوند:
- مجموعه آموزشهای برنامهنویسی اندروید
- مجموعه آموزشهای برنامهنویسی جاوا
- مجموعه آموزشهای برنامهنویسی
- مفاهیم مقدماتی فلاتر (Flutter) — به زبان ساده
- تشخیص چهره با فلاتر — راهنمای کاربردی
- اپلیکیشن چند پلتفرمی دسته بندی تصاویر با فلاتر و Fastai — از صفر تا صد
==