web-dev-qa-db-fra.com

Authentification SAML2.0 avec Node.js et SPA

Je me gratte la tête depuis environ 2 jours sur la façon de résoudre ce qui semblait être une tâche simple, mais cela commence à me rendre fou.

J'ai une application où les utilisateurs utiliseront SAML 2.0 pour s'authentifier. J'ai une application de réaction configurée pour le front-end, et je pensais que j'allais utiliser JWT pour sécuriser la communication reste-api entre le front-end et le backend.

Lorsqu'un utilisateur se connecte, le flux est le suivant:

  1. L'utilisateur accède à www.server.com/ et reçoit le HTML statique avec react-application
  2. L'utilisateur clique sur "Se connecter" et accède à www.server.com/login
  3. passport-saml redirige l'utilisateur vers le fournisseur d'identité saml. L'utilisateur se connecte.
  4. L'utilisateur rappelle à www.server.com/callback avec un SamlResponse dans le req.body qui est décodé par passport-saml et mis dans req.user.
  5. Si l'utilisateur n'existe pas déjà, je crée l'utilisateur dans la base de données.
  6. Je crée un JWT.

Que devrais-je faire ensuite? Le problème est que l'utilisateur n'est pas dans l'application de réaction lors du rappel du fournisseur d'identité, j'ai donc perdu tout état dans l'application, donc tout ce que je répondrai sera envoyé au navigateur.

Existe-t-il un moyen de forcer le navigateur à me donner la SamlResponse avec laquelle le fournisseur d'identité rappelle? Ensuite, je pourrais l'envoyer au serveur en tant que demande http de la react-application.

14
Stian Bakken

Après réflexion, j'ai trouvé la solution suivante qui a très bien fonctionné pour moi.

SAML a quelque chose appelé RelayState qui est une propriété avec laquelle le fournisseur de services doit répondre. Alors maintenant, le processus ressemble à ceci:

  1. L'utilisateur accède à http://frontendserver.com et obtient au serveur la page statique avec l'application React (non connectée).
  2. L'utilisateur clique sur "Connexion" et est redirigé vers http://backendserver.com/login/?RelayState=http://frontendserver.com qui s'authentifie via passport-saml et redirige l'utilisateur vers SP. Je passe donc l'origine de la demande dans RelayState.
  3. L'utilisateur rappelle à http://backendserver.com/callback avec SamlResponse, qui inclut RelayState.
  4. Je crée un jeton et redirige l'utilisateur vers RelayState/#token.
  5. Je peux ensuite analyser l'url dans l'application React, et ajouter le jeton comme en-tête pour toute autre demande.

Cela aurait pu sembler être la façon évidente de le faire, mais il m'a fallu un certain temps pour comprendre que cela fonctionnerait.

16
Stian Bakken

Je sais que cette question est pour Node backend, mais j'ai trouvé un article de l'implémentation d'un backend PHP/Apache webserver ici et je pense que cela peut aider quelqu'un qui essaie de comprendre le déroulement du processus de fonctionnement de ce type de chose.

0
Iruku Kagika