B4J Tutorial [ABMaterial] Firebase Auth for Users in 1.20

Discussion in 'B4J Tutorials' started by alwaysbusy, Jun 15, 2016.

  1. alwaysbusy

    alwaysbusy Expert Licensed User

    Just like Erel has added the Firebase Auth Service to B4A (https://www.b4x.com/android/forum/threads/firebaseauth-authenticate-your-users.67875/) you can also use it to login with your ABMaterial (1.20) WebApp.

    For WebApps, the procedure is quite simple.

    Setup:

    1. In the Firebase console create a new Project: https://console.firebase.google.com/
    [​IMG]

    2. Click 'Add Firebase to your web app'.

    3. You get all the keys needed for ABMaterial.
    [​IMG]

    Usage in ABMaterial:

    1. In BuildPage() initialize the Firebase API:

    Code:
    ' NEW FIREBASE
        page.Firebase.ApiKey = "AIzaSyCS5-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
        
    page.Firebase.AuthDomain = "project-xxxxxxxxxxxxxxxxxxxxxxxxxxx.firebaseapp.com"
        
    page.Firebase.DatabaseURL = "https://project-xxxxxxxxxxxxxxxxxxxxxxxx.firebaseio.com" 
        
    page.Firebase.StorageBucket = "project-xxxxxxxxxxxxxxxxxxxxxxx.appspot.com"
    2. In Websocket_Connected() use one of the Firebase connection methods. You can also create buttons and then in the Clicked_Event call the one you want (Google, Facebook, ...)

    Code:
    ' NEW FIREBASE
       page.Firebase.CheckAuthorized
    3. The events:

    Code:
    ' NEW FIREBASE
    Sub Page_FirebaseAuthStateChanged(IsLoggedIn As Boolean)   
      
    Log(IsLoggedIn)
       
    If IsLoggedIn Then     
         
    page.Firebase.Auth.CurrentUser.UpdateFromBrowser' IMPORTANT
         Log("ProviderId: " & page.Firebase.Auth.CurrentUser.ProviderId)
         
    Log("ProviderData: " & page.Firebase.Auth.CurrentUser.ProviderData.Size)
       
    Else
         
    Log("Authorizing...")     
         
    page.Firebase.Auth.SignInWithGoogle(False)   
       
    End If
    End Sub

    ' NEW FIREBASE
    Sub Page_FirebaseAuthError(extra As String)
        
    Log(extra)
    End Sub
    4. You can sign out by using page.Firebase.Auth.SignOut(). Depending on the result, one of the above events will be raised.

    EDIT: Updated the SignIn... methods to match the B4A ones. I also simplified the check to one command:

    page.Firebase.CheckAuthorized
     
    Last edited: Jun 16, 2016
  2. litefrez

    litefrez New Member Licensed User

    Working with this auth using the firebase gmail and email and password, but having an issue troubleshooting why my google auth works fine, but the email/password does not appear to return an error or a change of user state. Any help with trying to find the return or any log data of the info passed between my app and the firebase server would be appreciated.
     
  3. alwaysbusy

    alwaysbusy Expert Licensed User

  4. litefrez

    litefrez New Member Licensed User

    Actually, I apologize for bothering you. I found out that the b4a firebase auth lib doesn't allow it, I can't use it for the time being anyway. Once the b4a lib is updated to include it, if that ever happens, I will get back on this. Thank you so much for your willingness and for the abmaterial work that you have done. I have another question possibly if I can't figure it out, I will be posting a new question. Thanks again.
     
  5. slamarca

    slamarca Member Licensed User

    Hi I can't figure which is the logic flow in trying to authenticate with Firebase from the ABMaterial Demo app login modal.
    Do someone have a working fragment to show me the way?

    Thanks to all.
     
  6. alwaysbusy

    alwaysbusy Expert Licensed User

    Where are you stuck? Just follow the steps in the first post and add the code in the appropriate events/methods. You do not need the demos login screen so remove it.
     
  7. Cableguy

    Cableguy Expert Licensed User

    Is it possible to have a "Remember me" action?
     
  8. stanmiller

    stanmiller Active Member Licensed User

    @alwaysbusy

    Firebase has added a new field to the configuration, messagingSenderID. Plus the version is now 3.6.4.

    <script src="https://www.gstatic.com/firebasejs/3.6.4/firebase.js"></script>
    <script>
    // Initialize Firebase
    var config = {
    apiKey: "AIzaSyxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "mywebtoberapp-984d6.firebaseapp.com",
    databaseURL: "https://mywebtoberapp-984d6.firebaseio.com",
    storageBucket: "mywebtoberapp-984d6-979d6.appspot.com",
    messagingSenderId: "123456789012"
    };
    firebase.initializeApp(config);
    </script>

    Didn't know if you had this on the list. I can add to the feedback portal.
     
    amminf likes this.
  9. alwaysbusy

    alwaysbusy Expert Licensed User

    @stanmiller Please do add it to the feedback app, else it will be lost in the noise.
     
  10. stanmiller

    stanmiller Active Member Licensed User

    Done
     
    alwaysbusy likes this.
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice