Advance Mobile Application Development class 07

MazinAlkthere 156 views 28 slides Apr 29, 2024
Slide 1
Slide 1 of 28
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21
Slide 22
22
Slide 23
23
Slide 24
24
Slide 25
25
Slide 26
26
Slide 27
27
Slide 28
28

About This Presentation

Advance Mobile application development -(firebase Auth) for faculty of computers stuents seiyun University , yemen class - 07


Slide Content

Advance Mobile Application Development Firebase Auth Dr. Mazin Alkathiri IT Department Seiyun University 2023-2024

Firebase Authentication Most apps need to know the identity of a user. Knowing a user's identity allows an app to securely save user data in the cloud and provide the same personalized experience across all of the user's devices . Firebase Authentication provides backend services, easy-to-use SDKs, and ready-made UI libraries to authenticate users to your app. It supports authentication using passwords, phone numbers, popular federated identity providers like Google, Facebook and Twitter, and more.

Why firebase Auth Being able to authenticate our users securely, it offers a customized experience to them based on their interests and preferences. We can ensure that they have no problems accessing their private data while using our app from multiple devices. Firebase Authentication provides all the server-side stuff for authenticating the user. Firebase Authentication becomes easy with SDK. It makes API easy to use. Firebase Authentication also provides some user interface libraries which enable screens for us when we are logging it .

Cont. Firebase authentication supports authentication using a password, phone numbers, popular identity provider like Google, Facebook, and Twitter, etc. We can sign in users to our app by using the FirebaseUI . It handles the UI flows for signing in user with an email address and password, phone numbers, and popular providers, including Google sign-In and Facebook Login. It can also handle cases like account recovery. It is not required to design a UI since it is already provided for us. It means we don't have to write the activities. We can also sign-in users using the Firebase Authentication SDK to integrate one or several sign-in methods into our app manually.

How Authentication Works ? We first get authentication credentials from the user to sign a user into our app. Credentials can be the user's email address and password. The credential can be an OAuth token from an identity provider. We then pass these credentials to the Firebase Authentication SDK. Backend services will then verify those credentials and return a response to the client. After a successful sign in: We can access the user's access to data stored in other Firebase products. We can access the user's basic profile information. We can use the provided authentication token to verify the identity of users in our own backend services. An authenticated user can read and write data to the Firebase Real-time Database and Cloud Storage. We can control the access of those authenticated users by modifying the Firebase Database Rules and Storage Security Rules.

Users A Firebase User object represents the account of a user who has signed up to the app in Firebase project. Apps have many registered users, and every app in a Firebase project shares a user data base. AFirebase User instance is independent of a Firebase Auth instance. It means we can have several references to different users within the same context and still call any of their method A Firebase User has a fixed set of basic properties such as Unique ID, Primary email address, Name, and a photo URL. Firstly, a user signs up to the app. The user's profile data is populated with the primary email address if using email/password auth , account information available by the provider if using identity auth , and anything we want if using custom auth. The user becomes the current user of the Auth instance when a user signs up or signs in. The Auth instance stops to keep a reference to the User object. And no longer persists it states when a user signs out: No current user The user instance continues to be completely functional If we keep a reference to it, we can still access and update the user's data. Using listeners is the recommended way to track the current state of the Auth instance. An Auth listener gets notified any time when something relevant happens to the Auth object.

User Lifecycle An Auth listener gets notified in the following situation The Auth object finishes initializing, and a user was already signed in from a previous session or has been redirected from an identity provider's sign-in flow A user signs in. A user signs out. The current user's access token is refreshed: The access token expires. The user changes their password. The user re-authenticates

Firebase: Google Sign-In Authentication As we have discussed earlier, Firebase provides different types of Authentication methods. In our previous section, we learned how authentication is done using Firebase UI and Firebase SDK. In this section, we will learn another method, i.e., Google Sign-in Authentication. It is pretty easy to do. Starting steps are the same as we have done with other authentication methods, which are as follows: Creating an Android project. Creating a Firebase project. Adding Firebase to the Android project or application, either manually or Firebase Assistance. Adding the required libraries and JSON files.

Command to get debug SHA-1 (for Windows ) where password is Android keytool -list -v -alias androiddebugkey - keystore C:\Users\hp\.android\debug.keystore

Coding part Starting by Adding the dependencies to pubspec.yaml file under dependency section.run the following cmd for add latest version dependencies . flutter pub add firebase_auth flutter pub add google_sign_in

Building the login UI Creating a login.dart With the class GoogleSignInScreen with the help of ValueListenableBuilder import ' package:firebase_auth / firebase_auth.dart ' ; import ' package:flutter / material.dart ' ; import ' package:google_sign_in / google_sign_in.dart ' ; import ' package:tryingfirebase / home.dart ' ;

t is an amazing widget. It builds the widget every time the valueListenable value changes. Its values remain synced with there listeners i.e. whenever the values change the ValueListenable listen to it. It updates the UI without using setState () or any other state management technique. Properties : valueListenable : builder: child : These are the three properties of ValueListenableBuilder . bulder build widget depending upon the valueListenable value. valueListenable is an instance of ValueNotifier . child property is optional, it can be null if valueListenable value entirely depends upon the builder widget.

body: ValueListenableBuilder ( valueListenable : userCredential , builder: (context , value , child) { return ( userCredential . value == '' || userCredential . value == null ) ? Center ( child: Card ( …..…………… ) , ) : Center ( child: Column ( …………………… ) , ) ; })

? Center ( child: Card ( elevation: 5 , shape: RoundedRectangleBorder ( borderRadius : BorderRadius . circular ( 10 )) , child: IconButton ( iconSize : 1 , icon: Image . asset ( 'assets/images/google_icon.png' , ) , onPressed : () async { userCredential . value = await signInWithGoogle () ; if ( userCredential . value != null ) print( userCredential . value .user!.email ) ; Navigator. push (context , MaterialPageRoute ( builder: (context) => HomeMenu ( userCredential ) , ) , ) ; } , ) , ) , )

children: [ Container ( decoration: BoxDecoration ( shape: BoxShape. circle , border: Border . all ( width: 1.5 , color: Colors. black54 )) , child: Image . network ( userCredential . value .user!. photoURL.toString ()) , ) , const SizedBox (height: 20 ) , Text ( userCredential . value .user!. displayName.toString ()) , const SizedBox (height: 20 ) , Text ( userCredential . value .user!. email.toString ()) , const SizedBox (height: 30 ) , ElevatedButton ( onPressed : () async { bool result = await signOutFromGoogle () ; if (result) userCredential . value = '' ; } , child: const Text ( 'Logout' )) ] ,

Future< dynamic > signInWithGoogle () async { try { final GoogleSignInAccount ? googleUser = await GoogleSignIn (). signIn () ; final GoogleSignInAuthentication ? googleAuth = await googleUser ?. authentication ; final credential = GoogleAuthProvider. credential ( accessToken : googleAuth ?. accessToken , idToken : googleAuth ?. idToken , ) ; return await FirebaseAuth. instance .signInWithCredential (credential) ; } on Exception catch (e) { // TODO print( 'exception-> $e ' ) ; } }

Future<bool> signOutFromGoogle () async { try { await FirebaseAuth. instance .signOut () ; return true; } on Exception catch (_) { return false; } } }

Change the rules in Firestore Database

Change the rules in firebase Storage