I've been scratching my head for about 2 days on how to solve what seemed to be a simple task, but it's starting to drive me crazy.
I have an application where users will use SAML 2.0 to authenticate. I have a react-application set up for the front-end, and was thinking I was gonna use JWT to secure the rest-api communication between front-end and backend.
When a user signs in, the flow is the following:
What should I do next? The problem is that the user is not in the react-application when calling back from the identity provider, so I've lost all state in the application, so whatever I reply with will get sent to the browser.
Is there any way I could force the browser to give me the SamlResponse which the identityprovider is calling back with? Then I could send it to the server as a http-request from the react-application.
After some thinking, I came up with the following solution which worked quite nicely for me.
SAML has something called RelayState
which is a property that the Service Provider has to respond with. So now the process looks like this:
http://frontendserver.com
and gets server the static page with the React application (not signed in.).http://backendserver.com/login/?RelayState=http://frontendserver.com
which authenticates via passport-saml and redirects user to SP. So I pass the origin of the request in RelayState.RelayState/#token
.This might've seemed like the obvious way to do it, but it took me quite a while to figure out that this would work.