Future OpenIdConnect.authorizeInteractive directly returns null for response when param 'useWebPopup' is false in 2024

[s681562]

This behaviour can be reproduced in the Example project using 'Interactive Authorization Code PKCE' option in 2024.

final identity = await OpenIdConnect.authorizeInteractive(
         context: context,
         title: "Login",
       request: await InteractiveAuthorizationRequest.create(...

If i use useWebPopup: false, I got always immediately null as Authorization response.

If i use useWebPopup: true, I got always immediately ClientException: XMLHttpRequest error., uri=https://.../protocol/openid-connect/token

I tried this solution:
I read #44.

I follow the new example ahmednfwela commented on Jul 13, 2023

client = await OpenIdConnectClient.create(...

final identity = await client.loginInteractive(
  context: context,
  title: "Login",
  useWebPopup: true,
);

Now if i use useWebPopup: false, I got always

Error
at Object.throw_ [as throw] (http://localhost:49430/dart_sdk.js:12009:11)
at openidconnect.OpenIdConnectClient.__.loginInteractive (http://localhost:49430/packages/openidconnect/openidconnect.dart.lib.js:746:43)
at loginInteractive.next ()
at http://localhost:49430/dart_sdk.js:47139:33
at _RootZone.runUnary (http://localhost:49430/dart_sdk.js:46996:59)
at _FutureListener.thenAwait.handleValue (http://localhost:49430/dart_sdk.js:42384:29)
at handleValueCallback (http://localhost:49430/dart_sdk.js:42996:49)
at _Future._propagateToListeners (http://localhost:49430/dart_sdk.js:43034:17)
at [_completeWithValue] (http://localhost:49430/dart_sdk.js:42875:23)
at async._AsyncCallbackEntry.new.callback (http://localhost:49430/dart_sdk.js:42909:35)
at Object._microtaskLoop (http://localhost:49430/dart_sdk.js:47452:13)
at _startMicrotaskLoop (http://localhost:49430/dart_sdk.js:47458:13)
at http://localhost:49430/dart_sdk.js:43258:9

Now if i use useWebPopup: true, I got always immediately ClientException: XMLHttpRequest error., uri=https://.../protocol/openid-connect/token

The main problem is still there, not solved. Only the behavior for producing error is changed.

Any ideas? Our keycloak works fine. All settings include callback are fine.

Has anyone better experience with flutter package oidc (package:oidc) ?

[ahmednfwela]

Hi @s681562 , I suggest you give package:oidc a try since it also works with WASM, while this package is using old dart js interop.

the reason you get an immediate null with useWebPopup: false makes sense, as the package will redirect the browser to the auth page in the same tab as your app, which will clear the app from memory.

[s681562]

Hi @ahmednfwela,

I am using right now package:oidc. Thank you for your effort.

What I found out:

CORS problem.

ClientException: XMLHttpRequest error., uri=https://.../realms/.../protocol/openid-connect/token

For my test client on localhost I don't have cors issue.
package:oidc works fine with useWebPopup: false.

But in production I still have an keycloak issue with cors.

Therefore identity = await manager!.loginAuthorizationCodeFlow(); gives an error.

Any ideas to solve this cors problem with keycloak 25.0.1.?

Btw...
with package:oidc on Logout comes an white new Browser window with nothing inside, if the user click on logout without beeing logged in before. This window is not closing itself. This is unexpected (why is there suddenly an white new window)? The body of this window is totally empty. So this must be something else then redirect.html with a lot of javascript inside. But I can not fetch any errors.

await manager!.logout( //after logout, go back to home originalUri: Uri.parse('/'), options: OidcPlatformSpecificOptions( web: OidcPlatformSpecificOptions_Web( navigationMode: OidcPlatformSpecificOptions_Web_NavigationMode.newPage, ), ), );
This piece of code from package:oidc gives an white page, no errors, if user logged out without login in before.

Any ideas?

[ahmednfwela]

The cors issue is because you haven't configured Web Origins correctly in keycloak, so when we send a request to get the token after login, it fails.

If the user click on logout without beeing logged in before.

the logout method is designed to logout any logged in user, if you want to logout the user without being logged in, just redirect them to the idp logout page manually

checkout this SO issue https://stackoverflow.com/questions/46220566/keycloak-cors-issue-when-being-redirected-to-login

[s681562]

Thank you.
I set in keycloak param Web Origins on "+" and it works.