Onboarding (KYC/KYB)

3 min read

This guide adds the Footprint onboarding flow for KYC (Know Your Customer) and KYB (Know Your Business) to your Flutter app. Install footprint_flutter first: Installation.

The onboarding integration requires footprint_flutter: ^2.2.2 or higher.

Start an onboarding

Create an onboarding session. Call POST /onboardings and keep the onboarding session token it returns, such as obtok_UxM6Vbvk2Rcy1gzcSuXgk3sj3L9I0pAnNH.
Launch the flow. When the user taps a button, for example, call onboarding.initialize with the onboardingSessionToken, a redirectUrl, your BuildContext, and an onComplete callback.

dart
1Widget build(BuildContext context) {
2  return MaterialApp(
3    home: Scaffold(
4      body: Center(
5        child: ElevatedButton(
6          onPressed: () {
7            onboarding.initialize(
8              onboardingSessionToken: "YOUR SESSION TOKEN",
9              redirectUrl: "YOUR REDIRECT URL (example: com.footprint.fluttersdk://example)",
10              context: context,
11              onComplete: (token) {
12                print("onComplete: $token");
13              },
14            );
15          },
16          child: Text('Launch Footprint Onboarding'),
17        ),
18      ),
19    ),
20  );
21}

Handle the result

When the user completes the flow, onComplete receives a validationToken. Post it to your backend for further processing.

The SDK also reports cancellation and errors. Pass onCancel and onError to initialize:

dart
1onboarding.initialize(
2  onboardingSessionToken: "YOUR SESSION TOKEN",
3  redirectUrl: "YOUR REDIRECT URL (example: com.footprint.fluttersdk://example)",
4  context: context,
5  onComplete: (token) {
6    print("onComplete: $token");
7  },
8  onCancel: () {
9    print("onCancel: user canceled the flow");
10  },
11  onError: (error) {
12    print("onError: $error");
13  },
14);

Customize the appearance

Pass an appearance object to initialize to change the look of the flow:

dart
1onboarding.initialize(
2  onboardingSessionToken: "YOUR SESSION TOKEN",
3  redirectUrl: "YOUR REDIRECT URL (example: com.footprint.fluttersdk://example)",
4  context: context,
5  onComplete: (token) {
6    print("onComplete: $token");
7  },
8  appearance: FootprintAppearance(
9    variables: FootprintAppearanceVariables(
10      borderRadius: "8px",
11      colorSuccess: "#10b981",
12      colorError: "#F87171",
13      buttonPrimaryBg: "#5550e9",
14    ),
15  ),
16);

The customization guide lists every variable.

Available props

Variable	Description
`onboardingSessionToken`	The onboarding session token you created.
`redirectUrl`	A deep link used to navigate back to your app if the in-app browser was opened during the onboarding process.
`context`	Your widget's `BuildContext`.
`onComplete`	Optional. Triggered after the user completes the onboarding flow. You receive a `validationToken` that your backend can exchange with Footprint to see the `fp_id`, the login method used, and the KYC status.
`onError`	Optional. Called when there was an unrecoverable error during the onboarding flow.
`onCancel`	Optional. Triggered when the user abandons the flow.
`appearance`	Optional. A `FootprintAppearance` object that customizes the look of your integration.
`l10n`	Optional. The desired localization, as a `FootprintL10n` object. See Localization configuration.

Next steps

Handle the decision validates the token on your backend and reads the onboarding status.
Changelog lists notable releases of footprint_flutter.