Try the Flutter AppAuth Sample App

~3 min

The ThunderID samples repository ships a sample in samples/integrations/flutter-app-auth that runs the code from the Flutter AppAuth guide: sign-in with authorization code and PKCE in the system browser, token refresh with rotation, session restore when the application restarts, and sign-out through the end session endpoint, on Android and iOS.

Try the sample

Prerequisites

Flutter 3.38.1 or later, an Android emulator (API 24+) or an iOS Simulator (iOS 13+), and a running ThunderID instance. The steps use https://localhost:8090, the default for a local install.

Get the sample

The sample lives in the ThunderID samples repository. A sparse checkout downloads only the sample directory rather than the whole repository.

bash

git clone --depth 1 --filter=blob:none --sparse https://github.com/thunder-id/samples.git
cd samples
git sparse-checkout set samples/integrations/flutter-app-auth
cd samples/integrations/flutter-app-auth
flutter pub get

Create the application in ThunderID

The sample uses the com.example.appauth scheme, so register its redirect URIs exactly as below. The ID token attributes decide what the sample shows as the signed-in user's name.

Open the Console at https://localhost:8090/console and navigate to Applications

Click Add Application and select Flutter

Under Sign-In Approach, select Redirect to ThunderID Gate

Under Deep Link / Universal Link, enter com.example.appauth://callback

Click Create, then copy the Client ID

On the Advanced tab, add com.example.appauth://logout under Post-Logout Redirect URIs and save

On the Token tab, open User, then ID Token, and add email and name

Trust the local certificate

A local ThunderID serves a self-signed certificate, which the device must trust before the browser or AppAuth can reach it. Debug builds of the sample already trust user-installed certificates through android/app/src/debug/res/xml/network_security_config.xml, so only the device needs setting up. Run these once per emulator or simulator.

bash

# Forward the emulator's localhost:8090 to your machine.
adb reverse tcp:8090 tcp:8090

# Copy the certificate, then install it on the emulator: Settings > Security & privacy >
# More security & privacy > Encryption & credentials > Install a certificate > CA certificate,
# and select thunderid-dev.crt from Downloads.
adb push <THUNDERID_HOME>/config/certs/server.cert /sdcard/Download/thunderid-dev.crt

Configure and run

The sample reads its settings at build time, so there is no file to edit. Pass the Client ID from the Console with --dart-define. For an instance other than https://localhost:8090, also pass THUNDERID_ISSUER.

bash

flutter run --dart-define=THUNDERID_CLIENT_ID=<your-client-id>

# A different instance:
flutter run --dart-define=THUNDERID_CLIENT_ID=<your-client-id> \
  --dart-define=THUNDERID_ISSUER=https://thunderid.example.com

Try it out

Tap Sign in and sign in on the ThunderID page that opens in the browser. The application shows the signed-in user's name and the access token's expiry. Tap Refresh tokens to exchange the refresh token, restart the application to see the session restored from the stored refresh token, and tap Sign out to end the ThunderID session and return to the application.

Sample contents

FileWhat it does

lib/auth_config.dartIssuer, client ID, redirect URIs, and scopes, read from --dart-define.

lib/auth_service.dartSign-in, refresh, session restore, and sign-out with flutter_appauth.

lib/main.dartA single screen that drives the service.

android/app/build.gradle.ktsRegisters the com.example.appauth redirect scheme.

android/app/src/main/AndroidManifest.xmlMainActivity without android:taskAffinity="", so the redirect completes sign-in.

ios/Runner/Info.plistRegisters the same scheme under CFBundleURLTypes.

Sample source

Sample on GitHub

Sample README