Auth0 allows you to quickly add authentication and access user profile information in your app. This guide
demonstrates how to integrate Auth0 with a Flutter app using the Auth0 Flutter SDK.This quickstart assumes you already have a Flutter app up and running. If not, check out the Flutter “getting
started” guides to get started with a simple app.You should also be familiar with the Flutter command line tool.
The Flutter SDK currently only supports Flutter apps for Android, iOS, and macOS.
New to Auth? Learn How Auth0 works,
how it integrates with Single-Page Applications and which protocol it uses.
1
Configure Auth0
To use Auth0 services, you need to have an application set up in the Auth0 Dashboard. The Auth0 application is
where you will configure how you want authentication to work for your project.For example, if your iOS bundle identifier were
Configure an Auth0 application
Use the interactive selector to create a new Auth0 application or select an existing Native Auth0 application. Every application in Auth0 is assigned an alphanumeric, unique client ID that your application code will use to call Auth0 APIs through the SDK.Any settings you configure using this quickstart will automatically update for your application in the Dashboard, which is where you can manage your applications in the future.If you would rather explore a complete configuration, you can view a sample app instead.Configure the callback and logout URLs
The callback and logout URLs are the URLs that Auth0 invokes to redirect back to your app. Auth0 invokes the callback URL after authenticating the user, and the logout URL after removing the session cookie. If the callback and logout URLs are not set, users will be unable to log in and out of the app and will get an error.Set the callback and logout URLs to the following values, depending on your platform.On Android, the value of the
SCHEME
placeholder can be https
or some other
custom scheme. https
schemes require enabling Android App Links.On iOS 17.4+ and macOS 14.4+ it is possible to use Universal Links (https
scheme) as
callback and logout URLs. When enabled, the SDK will fall back to using a custom URL scheme on older iOS
/ macOS versions –your app’s bundle identifier. This feature requires Xcode 15.3+ and a paid Apple
Developer account.Android
iOS
macOS
com.example.MyApp
and your Auth0 domain were
example.us.auth0.com
, then this value would be:2
Install the Auth0 Flutter SDK
Add the Auth0 Flutter SDK into the project:
3
Configure Android
If you are not developing for the Android platform, skip this step.The SDK requires manifest placeholders. Auth0 uses placeholders internally to define an
Run Sync Project with Gradle Files inside Android Studio to apply your changes.
intent-filter
, which captures the authentication callback URL. You must set the Auth0 tenant domain
and the callback URL scheme.The sample uses the following placeholders:auth0Domain
: The domain of your Auth0 tenant. Generally, you find this in the Auth0 Dashboard under your Application Settings in the Domain field. If you are using a custom domain, you should set this to the value of your custom domain instead.auth0Scheme
: The scheme to use. Can be a custom scheme, or https if you want to use Android App Links. You can read more about setting this value in the Auth0.Android SDK README.
You do not need to declare a specific
intent-filter
for your activity because you defined
the manifest placeholders with your Auth0 Domain and Scheme values. The library handles
the redirection for you.4
Configure iOS/macOS
If you are not developing for the iOS or macOS platforms, skip this step.
This will add your app to your Auth0 tenant’s
Next, add the following entry under Associated Domains:
This step requires a paid Apple Developer account. It is needed to use Universal Links as callback and
logout URLs. Skip this step to use a custom URL scheme instead.
Configure the Team ID and bundle identifier
Go to the settings page of your Auth0 application, scroll to the end, and open Advanced Settings > Device Settings. In the iOS section, set Team ID to your Apple Team ID, and App ID to your app’s bundle identifier.
apple-app-site-association
file.Add the associated domain capability
Open your app in Xcode by runningopen ios/Runner.xcworkspace
(or
open macos/Runner.xcworkspace
for macOS). Go to the Signing and Capabilities tab of the Runner target settings, and press the +
Capability button. Then select Associated Domains.
For the associated domain to work, your app must be signed with your team certificate even when
building for the iOS simulator. Make sure you are using the Apple Team whose Team ID is configured
in the settings page of your Auth0 application.
5
Add login to your application
Universal Login is the easiest way to set up
authentication in your app. We recommend using it for the best experience, best security, and the fullest array of
features.Integrate Auth0 Universal Login in your Flutter app by using the When a user logs in, they are redirected back to your app. Then, you are able to access the ID and access tokens
for this user.
Auth0
class. Redirect your users to
the Auth0 Universal Login page using webAuthentication().login()
. This is a Future
and
must be awaited for you to retrieve the user’s tokens.Android: if you are using a custom scheme, pass this scheme to the login method so that the SDK can route
to the login page and back again correctly:Checkpoint
Add a button to your app that callswebAuthentication().login()
and logs the user into your
app. Verify that you are redirected to Auth0 for authentication and then back to your app.Verify that you can get access to the tokens on the result of calling login
.6
Add logout to your application
To log users out, redirect them to the Auth0 logout endpoint to clear their login session by calling the Auth0
Flutter SDK
webAuthentication().logout()
. Read
more about logging out of Auth0.Android: if you are using a custom scheme, pass this scheme to the logout method so that the SDK can route
back to your app correctly:Checkpoint
Add a button to your app that callswebAuthentication().logout()
and logs the user out of
your app. When you select it, verify that your Flutter app redirects you to the logout endpoint and back
again. You should not be logged in to your app.7
Show user profile information
The user profile automatically retrieves user profile properties for you when you call
webAuthentication().login()
. The returned object from the login step contains a user
property with all the user profile properties, which populates by decoding the ID token.Checkpoint
Log in and inspect theuser
property on the result. Verify the current user’s profile
information, such as email
or name
.Next Steps
Excellent work! If you made it this far, you should now have login, logout, and user profile information running in your application.This concludes our quickstart tutorial, but there is so much more to explore. To learn more about what you can do with Auth0, check out:- Auth0 Dashboard - Learn how to configure and manage your Auth0 tenant and applications
- auth0-flutter SDK - Explore the SDK used in this tutorial more fully
- Auth0 Marketplace - Discover integrations you can enable to extend Auth0’s functionality