I have encountered something very strange while testing my implementation of an Invite-Workflow.
What I do
I generate an invitation link for an organisation and send it to the user per mail. This all works fine. Since this invasion workflow requires an application login page, I have set one up with
https://login.myapp.local:3010
which let’s me test it all on my localhost. This also works fine! After clicking on the link I land on the login page which again redirects me to the corresponding login page for the organisation. I do this via a button onClick handler at the moment
onClick={ () => loginWithRedirect({ organization: organization, invitation: invitation, redirectUri: "https://login.myapp.local:3010/org-invite" }) }
The parameters organization and invitation are obviously fetched from the url.
After entering a password for the user, I get redirected back to https://login.myapp.local:3010/org-invite (note the org-invite since I want to have a separate implementation for the authorisation later on): All good. Now I would like to authorise the user with the application and get my ID token. I thought I can do this with
handleRedirectCallback(url)
but I constantly get the invalid state error.
I have checked my url and I don’t get any parameters attached (code and state is missing). If I change the allowed redirect urls for the application to something else which points to the same port on localhost (e.g. https://auth.myapp.local:3010/org-invite) I get the code and state parameter in the url but still the Invalid State error.
I have read here and here but unfortunately nothing was working so far.
Can someone please help?
Thanks!