authorizationCode flow for Flutter WEB is it possible?

[p3pp8]

Hello, i'm trying to implement the openid protocol using authorizationCode for flutter Web, i'm able to get code, state and session_state but when i call the Flow.callback function i always get an invalid Null on returned credentials object idToken. Any help is really appreciated.

[p3pp8]

Solved my own, i needed to start an authorizationCode flow with PKCE.

[adrian-moisa]

Hi @p3pp8! Can you provide a sample of your implementation? I'm trying to do the exact same setup. Thank you!

[pintarj]

Hi @adrian-moisa, I've also managed to make it work using code flow with PKCE. I started creating a custom Authenticator starting from the browser Authenticator in the repository (this one). Then I changed the Flow.implicit(...) call with the Flow.authorizationCodeWithPKCE(...) like this:

static const String _keySessionStorageVerifier = 'openid_client:verifier';
var codeVerifier = window.sessionStorage[_keySessionStorageVerifier];

if (codeVerifier == null) {
  codeVerifier = _randomString(64);
  window.sessionStorage[_keySessionStorageVerifier] = codeVerifier;
}

flow = Flow.authorizationCodeWithPKCE(
  client,
  state: window.sessionStorage[_keySessionStorageState],
  codeVerifier: codeVerifier
);

flow.redirectUri = _uriNoQuery; // just query removed from the original URI

As you can see the code-verifier is needed for PKCE.

Disclaimer: I'm not sure of what's going on here. I don't know if it's right, I just needed this for a personal project and it worked.

[nev-21]

this article may help someone who wants to do authorization code flow with PKCE: https://medium.com/@rangika123.kanchana/keycloak-integration-for-flutter-web-using-openid-client-with-authorization-code-flow-489afeac6e9f