[B4X] Supabase - The Open Source Firebase alternative
Supabase is an open source Firebase alternative. It provides all the backend services you need to build a product. Supabase uses Postgres database with real-time capabilities. Basically, supabase provides an interface to manage postgres database that you can use to create table and insert, edit...
In this example, we will take a look at how we can implement authentication using Google sign-in to secure our application using the Supabase SDK for B4X.
Configure the Client IDs on the Google developer console
We will obtain client IDs for B4I, B4A and B4J from the Google Cloud console, and register them to our Supabase project.
1. Go to Google developer console, create a new project if needed and add a client id:
We need a separate Client Id for each platform.
- Type
- B4A=Android
- B4I=Ios
- B4J=Web application
Set the package name or bundle identifier fields to your app's package name.
For the B4J client you need to whitelist a uri:
B4X:
http://127.0.0.1:30002. B4A:
Add to the manifest editor:
B4X:
AddActivityText(Main,
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="$PACKAGE$" />
</intent-filter>
)
B4X:
Private Sub B4XPage_Foreground
#if B4A
xSupabase.Auth.CallFromResume(B4XPages.GetNativeParent(Me).GetStartingIntent)
#End If
End SubChange b4i.example2 with your package name.
B4X:
#UrlScheme: b4i.example2
B4X:
Private Sub Application_OpenUrl (Url As String, Data As Object, SourceApplication As String) As Boolean
B4XPages.MainPage.xSupabase.Auth.CallFromOpenUrl(Url)
Return True
End SubOpen the Supabase Dashboard and got to: authentication -> Providers -> Google
to set up Google auth. Toggle the Enable Sign in with Google switch first. Then add the 3 client IDs you obtained in your Google Cloud console to Authorized Client IDs field with a comma in between the two client IDs like this: ANDROID_CLIENT_ID,IOS_CLIENT_ID.
B4A, B4I and B4J Code
Simply insert the "xxx" with the client id from the respective platform. In B4J you still need the ClientSecret, you can also find it in the Google Dashboard.
B4X:
#If B4A
Wait For (xSupabase.Auth.SignInWithOAuth("xxx.apps.googleusercontent.com","google","profile email https://www.googleapis.com/auth/userinfo.email")) Complete (User As SupabaseUser)
#Else If B4I
Wait For (xSupabase.Auth.SignInWithOAuth("xxx.apps.googleusercontent.com","google","profile email https://www.googleapis.com/auth/userinfo.email")) Complete (User As SupabaseUser)
#Else If B4J
Wait For (xSupabase.Auth.SignInWithOAuth("xxx.apps.googleusercontent.com","google","profile email https://www.googleapis.com/auth/userinfo.email","xxx")) Complete (User As SupabaseUser)
#End If
If User.Error.Success Then
Log("successfully logged in with " & User.Email)
xui.MsgboxAsync("successfully logged in with " & User.Email, "SignIn with Google")
Else
Log("Error: " & User.Error.ErrorMessage)
xui.MsgboxAsync("Error: " & User.Error.ErrorMessage, "SignIn with Google")
End IfTips
It may be that you still need to enable the People API in the Google Dashboard.
That's it!
Now your users can easily log in to your app with google.