web-dev-qa-db-ja.com

Node.jsとSPAによるSAML2.0認証

簡単な作業のように思える問題を解決する方法について2日間頭を悩ませてきましたが、それは私を夢中にさせ始めています。

ユーザーが認証にSAML 2.0を使用するアプリケーションがあります。フロントエンド用に反応アプリケーションをセットアップしており、JWTを使用してフロントエンドとバックエンド間のrest-api通信を保護するつもりであると考えていました。

ユーザーがサインインするときのフローは次のとおりです。

  1. ユーザーはwww.server.com/にアクセスし、react-applicationで静的HTMLを提供されます
  2. ユーザーは「サインイン」をクリックしてwww.server.com/loginにアクセスします
  3. passport-samlは、ユーザーをsaml IDプロバイダーにリダイレクトします。ユーザーがログインします。
  4. ユーザーは、www.server.com/callbackにreq.bodyにSamlResponseを付けてコールバックします。これは、passport-samlによってデコードされ、req.userに入れられます。
  5. ユーザーがまだ存在しない場合は、データベースにユーザーを作成します。
  6. JWTを作成します。

次に何をすればいいですか？問題は、ユーザーがIDプロバイダーからコールバックすると、react-applicationにいないため、アプリケーションのすべての状態が失われるため、応答したものはすべてブラウザーに送信されることです。

IdentityproviderがコールバックするSamlResponseをブラウザーに強制する方法はありますか？次に、react-applicationからのhttp-requestとしてサーバーに送信します。

node.jsreactjssaml-2.0passport-saml
14
Stian Bakken

いくつか考えた後、次の解決策が思い付きました。

SAMLにはRelayStateという名前があり、これはサービスプロバイダーが応答する必要があるプロパティです。したがって、プロセスは次のようになります。

  1. ユーザーはhttp://frontendserver.comにアクセスし、Reactアプリケーション（サインインしていない））で静的ページをサーバーに取得します。
  2. ユーザーが[ログイン]をクリックすると、http://backendserver.com/login/?RelayState=http://frontendserver.comにリダイレクトされ、passport-samlを介して認証され、ユーザーがSPにリダイレクトされます。したがって、RelayStateでリクエストのオリジンを渡します。
  3. ユーザーは、RelayStateを含むSamlResponseで http://backendserver.com/callback にコールバックします。
  4. トークンを作成し、ユーザーをRelayState/#tokenにリダイレクトします。
  5. 次に、ReactアプリケーションでURLを解析し、それ以降のリクエストのヘッダーとしてトークンを追加します。

これは明白な方法のように思われたかもしれませんが、これが機能することを理解するのにかなり時間がかかりました。

16
Stian Bakken

私はこの質問がNodeバックエンド用であることを知っていますが、PHP/Apache Webサーバーバックエンドの実装の記事を見つけました ここ 、それは誰かがこの種のことがどのように機能するかのプロセスの流れを理解する。

0
Iruku Kagika