Skip to content

openid_client on Flutter Web/PWA always uses implicit flow (response_type=id_token token) instead of code flow, even with correct configuration #124

Description

@slfhstr

Describe the bug

When using openid_client (0.4.9) in a Flutter Web/PWA project, the authentication request always uses the implicit flow (response_type=id_token token), even though the code and configuration should trigger Authorization Code Flow with PKCE (response_type=code).

This results in login loops and prevents secure authentication with modern OIDC providers (Keycloak).

To Reproduce

1. Environment
Flutter version:
Flutter 3.29.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision ea121f8859 (2 weeks ago) • 2025-04-11 19:10:07 +0000
Engine • revision cf56914b32
Tools • Dart 3.7.2 • DevTools 2.42.3

Dart version:
Dart SDK version: 3.7.2 (stable) (Tue Mar 11 04:27:50 2025 -0700) on "macos_arm64"

openid_client version: 0.4.9

Keycloak version: 26.2.1

Browser(s): Chrome (latest)

PWA: Yes (installed and tested as PWA and in browser tab)

2. pubspec.yamlyaml

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.5
  shared_preferences: ^2.1.1
  openid_client: 0.4.9
  http: ^0.13.6
  flutter_markdown: ^0.6.14
  flutter_html: ^3.0.0-beta.2
  in_app_purchase: ^3.1.5
  in_app_purchase_storekit: ^0.3.8+1
  jose: ^0.3.3
  provider: ^6.0.5
  flutter_linkify: ^6.0.0
  url_launcher: ^6.3.1
  flutter_launcher_icons: ^0.14.3
  flutter_secure_storage: ^8.0.0

3. pubspec.lock (relevant section)

openid_client:
  dependency: "direct main"
  description:
    name: openid_client
    sha256: "1d39a829dc770947bf8ec8684a3456743ef0205a777371efe16773a44163eb6a"
    url: "https://pub.dev"
  source: hosted
  version: "0.4.9"

4. Code Sample

var authenticator = Authenticator(
  _client,
  scopes: ['openid', 'profile', 'email'],
);
// This should trigger code flow with PKCE
authenticator.authorize();

5. Keycloak Client Config
Standard OIDC client, Authorization Code Flow enabled, Implicit Flow disabled.

  1. Steps to Reproduce
    Build and deploy the Flutter web app.
    Open in browser or install as PWA.
    Observe the authentication request in the network tab.

Expected behavior

The authorization request should use:

response_type=code
and trigger the Authorization Code Flow with PKCE.

Actual behavior

The authorization request uses:

response_type=id_token token

which triggers the implicit flow (now discouraged/insecure and disabled by default in Keycloak).

This results in:

Login loops (as Keycloak blocks the request)
No refresh tokens
Inability to use secure, modern OIDC flows

Screenshots

Image

Additional context

  • A minimal HTML/JS OIDC test using the same Keycloak settings and response_type=code works as expected, confirming the Keycloak server is configured properly for code flow.
  • No openid_client_web or web plugin is present in the project.
  • Clean builds, cache clearing, and testing on multiple devices/browsers/PWA installs all produce the same result.
  • There are no other Dart/Flutter OIDC packages that support code flow on web.
  • This issue blocks secure authentication for all Flutter web/PWA projects using openid_client.

Workaround

Currently, the only workaround appears to be to use a JS OIDC client via Dart JS interop for web builds, which is not ideal.

Please advise if:

  • There is a known workaround or fix.
  • There are plans to update the web implementation to support code flow with PKCE for Flutter web/PWA.

Thank you for your help and for maintaining this important package!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions