Flutter SDK
How to integrate with a Flutter app
This guide provides instructions on integrating Authgear with a Flutter app. Supported platforms include:
- Flutter 2.5.0 or higher
Signup for an Authgear Portal account in https://portal.authgear.com/. Or you can use your self-deployed Authgear.
From the Project listing, create a new Project or select an existing Project. After that, we will need to create an application in the project.
Portal
authgear.yaml (self-deployed)
Step 1: Create an application in the Portal
- 1.Go to Applications on the left menu bar.
- 2.You will see the "New Application" page or Click ⊕Add Application in the top tool bar.
- 3.Input the name of your application and select Native App as the application type. Click "Save".
- 4.You will see a list of guides that can help you for setting up, then click "Next".

Create Application
Step 2: Configure the application
- 1.In your IDE, define a custom URI scheme that the users will be redirected back to your app after they have authenticated with Authgear, e.g.
com.myapp.example://host/path
.[^1] - 2.Head back to Authgear Portal, fill in the Redirect URI that you have defined in the previous steps.
- 3.Click "Save" in the top tool bar and keep the Client ID. You can also obtain it again from the Applications list later.

Edit an application
If you wish to validate JSON Web Token (JWT) in your own application server, select "Issue JWT as access token".[^2] If you wish to forward authentication requests to Authgear Resolver Endpoint, leave this unchecked. See comparisons in Backend Integration.

oauth:
clients:
- name: your_app_name
client_id: a_random_generated_string
redirect_uris:
- "com.myapp.example://host/path"
grant_types:
- authorization_code
- refresh_token
response_types:
- code
- none
Follow the documentation of Flutter to see how you can create a new Flutter app.
flutter create myapp
cd myapp
flutter pub add flutter_authgear
To finish the integration, setup the app to handle the redirectURI specified in the application. This part requires platform specific integration.
This declares the URL schemes supported by your app, so the device can redirect the user to the app after authentication using the redirect URI.
Add the following
<activity>
entry to the AndroidManifest.xml
of your app. The intent system would dispatch the redirect URI to OAuthRedirectActivity
and the SDK would handle the rest.<!-- Your application configuration. Omitted here for brevity -->
<application>
<!-- Other activities or entries -->
<!-- Add the following activity -->
<!-- android:exported="true" is required -->
<!-- See https://developer.android.com/about/versions/12/behavior-changes-12#exported -->
<activity android:name="com.authgear.flutter.OAuthRedirectActivity"
android:exported="true"
android:launchMode="singleTask">
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- Configure data to be the exact redirect URI your app uses. -->
<!-- Here, we are using com.authgear.example://host/path as configured in authgear.yaml. -->
<!-- NOTE: The redirectURI supplied in AuthenticateOptions *has* to match as well -->
<data android:scheme="com.myapp.example"
android:host="host"
android:pathPrefix="/path"/>
</intent-filter>
</activity>
</application>
If your Android app is targeting API level 30 or above (Android 11 or above), you need to add a
queries
section to AndroidManifest.xml
.<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Other elements such <application> -->
<queries>
<intent>
<action android:name="android.support.customtabs.action.CustomTabsService" />
</intent>
</queries>
</manifest>
In
Info.plist
, add the matching redirect URI by adding the key CFBundleURLTypes
and the values inside <dict>
as shown as the following example.<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<!-- Other entries -->
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
<string>com.myapp.example</string>
<!-- Put the redirect URI your app uses here. -->
</array>
</dict>
</array>
</dict>
</plist>
Add this code to your app. This snippet configures authgear to connect to an authgear server deployed at
endpoint
with the client you have just setup via clientID
, opens a browser for authentication, and then upon success redirects to the app via the redirectURI
specified.import 'package:flutter/material.dart';
import 'package:flutter_authgear/flutter_authgear.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);