Authentication with Auth0
In this tutorial we will show you how to integrate Auth0 with Abstra to enable in app authentication with the Sign-in and Sign-out actions.
After you create your account you will be presented with a dashboard.
Go to the
Applications menu.
Create a new application of the
Single Page Web Application type.
Go to the
Settings tab and scroll down to the Application URIs section. In the Allowed Callback URLs paste https://*.abstra.app/sign-in and in the Allowed Logout URLs paste https://*.abstra.app/sign-out
Scroll down to the
Refresh Token Rotation section and make sure the Rotation toggle is enabled
Scroll up to the
Basic Information section and take note of the Domain and Client ID values
Access your project and go to the
Settings page.Go to the
Authentication tab.
Paste the Domain in the Authority field prepended with the https:// protocol.
Paste the Client ID in the respective field.
You will also need to add the end_session_endpoint in the OIDC metadata overwrite session. The value should be:
yourOidcAuthorityUrl/v2/logout?client_id=yourClientId&returnTo=https://create.abstra.app/sign-out
youOidcAuthorityUrl should be replaced by the authority url you used in the configuration, yourClientId should be the client id for your authority.
And that's it, now you can test these settings. On the right there is the Try now section:
Right bellow will appear a box containing all the information the provider sends, which can be accessed with the user context variable with
$.user or {{ user }}.
For example name can be accessed with $.user.profile.name or {{ user.profile.name }}.
In this example we will implement a login button and display the logged user name.
We have a two pages:
The first has a
Button, an Sign-in action when it is clicked and a Go To Page for the second page if the sign-in was successful.
The second has a
Text with Mustache Notation and the Text Value isMy name is {{ user.profile.name }}.
This is the result.
Last modified 11mo ago