Firebase Authentication
Provide authentication to your database in UI Bakery
To provide authentication to your database in UI Bakery, follow the steps described below.
Use this authentication type for testing purposes only since it grants read access for every user.
To grant read permissions in UI Bakery to everyone, follow these steps:
- 1.
- 2.Add a code line
allow read: if true;
Adjusting Rules in Firestore
If you have already added Cloud Firestore as a data source and have an authentication error thrown after any Action is run, you might need to adjust your Firestore rules as stated above and then re-run your Action in UI Bakery.
To grant access only to your authorized users, please follow the below steps.
- 1.
- 2.Create a user for UI Bakery authorization (its credentials will be used later for authorization)
- 3.Copy its User UID
Copying USER UID
4. Next, go to your Cloud Firestore and open the Rules tab to configure access rights
5. Add a code line:
allow read, write: if request.auth.uid == 'User UID';
Updating rules for Firestore
Proceed to UI Bakery.
Open App Settings - Code section and insert the Firebase connection code:
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-auth-compat.js"></script>
<script>
firebase.initializeApp(Firebase config goes here);
</script>
If you need to enable other Firebase capabilities, you can connect the corresponding Firebase libraries. All available libraries are listed here:
Once done, proceed to the Builder to add a Login Action, that will authenticate the user and grant access to your Cloud Firestore. To create a Login Action:
- 1.
- 2.Specify the code below:
const email = "email_of_created_user";
const password = "password_of_created_user";
return firebase.auth().signInWithEmailAndPassword(email, password);
3. Run Action
Creating a Login Action
Please note that the Login Action should be run before any other Action
For example, to read your data with a prior login, do as follows:
- add a new Workflow
- step 1 - Execute Action - select login Action from the list
Listing data with a Login step
Use this authentication type for testing purposes only since it grants read access for everyone.
To grant read permissions in UI Bakery to everyone, follow these steps:
- 1.Navigate your Realtime Database - Rules
- 2.Add a code:
{
"rules": {
".read": true,
}
}
If you have already added Realtime DB as a datasource and have an authentication error thrown after any Action is run, you might need to adjust your Realtime DB rules as stated above and then re-run your Action in UI Bakery.
To grant access only to your authorized users, please follow these steps.
- 1.
- 2.Create a user for UI Bakery authorization (its credentials will be used later for authorization)
- 3.Copy its User UID
4. Next, go to your Realtime DB and open the Rules tab to configure access rights
5. Add a code line
{
"rules": {
"some_path": {
"$uid": {
".read": "auth.uid == 'User UID'",
".write": "auth.uid == 'User UID'"
}
}
}
}
Proceed to UI Bakery.
Open App Settings - Code section and insert the Firebase connection code:
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-firestore-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-auth-compat.js"></script>
<script>
firebase.initializeApp(Firebase config goes here);
</script>
If you want to enable other firebase capabilities, you have to connect corresponding firebase libraries. All the available libraries are listed here:
Once done, proceed to the Builder to add a Login Action, that will authenticate the user and grant access to your Realtime Database. To create a Login Action:
- 1.
- 2.Specify the code below:
const email = "email of a dummy user";
const password = "password of a dummy user";
return firebase.auth().signInWithEmailAndPassword(email, password);
3. Run Action
Please note that the Login Action should be run before any other Action
For example, to read your data with a prior login, do as follows:
- add a new Workflow
- step 1 - Execute Action - select login Action from the list
Nice job! You can proceed to build your app. The following articles will help you further:
Last modified 1mo ago