👻
Anonymous Login
Let app users enter some app sections without creating an account
With the Firebase anonymous login option, you can allow users to enter your app without authenticating or creating an account. You can choose which screens can be accessed with anonymous login, and which ones require the user to be authenticated.
This feature is implemented by giving each user a role. For Firebase, the following two roles are supported:
- Logged: user who has logged in using email/password or phone login.
- Anonymous: user who hasn’t logged in, but used the anonymous login to enter the app without a user account.
This feature needs to be set up together with any of the Firebase authentication methods (email/password, phone or both). Therefore, you'll need to create a Firebase project and follow the steps indicated in the Firebase authentication guide.
The following Bravo tags are needed to set it up.
[action:login:firebase-anonymous]. This tag is used to specify an anonymous login action on a UI element. For instance, could be added to a link/button where, if the user presses, they enter the app in anonymous mode (without user credentials).[require:scope:<list of roles, separated by commas>]. This tag needs to be added at page level. It sets the roles a user needs to have in order to access an app page. For Firebase anonymous login, there are the following two options:[require:scope:anonymous,logged]- both anonymous and authenticated users can view the page.[require:scope:logged]- only authenticated users can view the page.
[scopes-error]. Defines a general error page shown when the user tries to access a private page without the right access. This is the page that will be shown when an anonymous user tries to enter a page with the[require:scope:logged]tag. It's a good place to add a button to redirect the user to the login page, so anonymous users can authenticate.[state:error-scope:<name>]. Defines a specific state page that will show when the user try to access a private page without the right access. There should be a[state:default:<name>]page, which is the private page where only authorized users can access. Same as previous tag, but allows to create custom error pages for each private page. You need to replace <name> for any word of your choice. This will be used to link each default-error page pair.
You can duplicate our example design below to get started. It also includes email/password and phone authentication.
As indicated before, the anonymous login feature needs to be set up together with a Firebase login method. Therefore, you need to have a Firebase project and complete the setup required for those login methods.
To enable anonymous login, you need to add this method inside your Firebase project:
After setting this up, download the corresponding Firebase assets (Google Services plist for iOS, and Google Services JSON for Android) and upload them into Bravo as indicated here. In case you had done this in the past already, but you didn't include the anonymous login method in your Firebase projects, you'll need to download the assets again and re-upload them to your Bravo project.
Last modified 10mo ago