use Flow.authorizationCodeWithPKCE for browser based clients

[pitabwire]

PR to resolve : #91

[pitabwire]

@rbellens I didn't handle backwards incompatibility with this change, Though I can incooporate any improvements deemed fit

[alex27riva]

Hi, I'm developing a Flutter web app using openid_client with Oauth2 authentication with PKCE, as I understand the library uses Implicit Flow, does this PR fix this?
Also do you have some examples on how to use it?
Thanks

[wagnervf]

I'm in the same situation, I need PKCE authentication, does anyone know how to do it?

[RousseauRemi]

I am not a long date flutter dev, but you should maybe keep the possibility to do the implicit workflow using something like : (And adding an example at least on the flutter example for app and web)

class OIClientFlowConfig{
  Iterable<String> scopes = const [];
  String? prompt;
}
class ImplicitOIClientFlowConfig implements OIClientFlowConfig{
  @override
  String? prompt;
  @override
  Iterable<String> scopes = const [];
  String? device;
}
class PCKEOIClientFlowConfig implements OIClientFlowConfig{
  @override
  String? prompt;
  @override
  Iterable<String> scopes = const [];
  String? codeVerifier;
  Map<String, String>? additionalParameters;
}
class Authenticator {
  Authenticator(Client client,
      {OIClientFlowConfig config, required FlowType flowType})
      : this._(_createFlow(client, config, flowType));

  static Flow _createFlow(Client client, OIClientFlowConfig config, FlowType flowType) {
    if (flowType == FlowType.implicit) {
      var implicitConfig = (config as ImplicitOIClientFlowConfig);
      return Flow.implicit(client,
          device: implicitConfig.device,
          state: window.localStorage['openid_client:state'],
          prompt: implicitConfig.prompt)
        ..scopes.addAll(implicitConfig.scopes)
        ..redirectUri = Uri.parse(window.location.href).removeFragment();
    } else if (flowType == FlowType.authorizationCodeWithPcke) {
      var pckeConfig = (config as PCKEOIClientFlowConfig);
      return Flow.authorizationCodeWithPcke(client,
          codeVerifier: pckeConfig.codeVerifier,
          additionalParameters: pckeConfig.additionalParameters)
        ..scopes.addAll(pckeConfig.scopes)
        ..redirectUri = Uri.parse(window.location.href).removeFragment();
    } else {
      throw UnsupportedError('Unknown flow type: $flowType');
    }
  }
}

[RousseauRemi]

And what is done actually is only a part of the authentication code flow with pcke. here you get the authentication code, but you don't get the access token