OpenID-Connectプロバイダーを使用してReact-ReduxアプリにSSOを実装しようとしています。目的は、すべてのコンポーネントを保護し、セッションが終了した場合にユーザーをIDプロバイダーのログインページにリダイレクトすることです。これが、アプリケーションに専用のログインページ(コンポーネント)を設定できない理由です。 JWTをlocalStorageに保存するのは良い考えだと読んだので、ReduxストアでisAuthenticatedフラグを使用して、JWTをlocalStorageに保持することを考えていました。次に、localStorageからJWTをフェッチして、アプリ内から呼び出す他のAPIを認証できます。このアプローチは適切ですか?
さらに、この目的でJWTをフェッチ(および更新)するために使用できるライブラリ/パッケージを誰かに教えてもらえますか?私は多くのドキュメントを調べて次のことを試しましたが、これらを機能させることができませんでした。
redux-oidc :アプリケーションに特定のコールバックコンポーネントがないため、このアプローチをアプリに適用する方法がよくわかりません。
passport-openid-connect :PassportはセッションをCookieに保存することに依存していますが、代わりにlocalSorageを使用したいと思います。
redux-auth-wrapper :高次のコンポーネントは素晴らしいように聞こえますが、専用のログインコンポーネントがないと統合する方法がわかりません。
誰かが私を案内してくれませんか?私はReactエコシステムの初心者なので、理解できないことをお許しください。
どんな助けでも大歓迎です!
ありがとう
あなたは正しい方向に進んでいます-redux-oidcはログインの詳細でReduxの状態を管理します-実際にJWT(暗黙のフロー)を管理し、IdentityServer(どちらか)のログインページにリダイレクトしてアプリに戻るクライアントライブラリ(「コールバック」 ")はoidc-clientです。
redux-auth-wrapperは単なるHOC(高次コンポーネント)です-基本的にユーザーが認証されているかどうかをチェックし(Reduxストアまたはカスタム関数で)、ログインページに転送するラッパーです-私の意見ではあなたはしませんredux-oidcはすでに必要なものをすべて提供しているので、本当に必要です。
私も個人的に IdentityServer4 -を実装して、すべての外部プロバイダーを一元管理しました-これまでのところうまく機能しています。
最初に確認することをお勧めします https://blogs.msdn.Microsoft.com/webdev/2017/04/26/the-mvp-show-learns-about-asp-net-identity-server-and- heidelberg / ここで、IdentityServer4の作成者は、識別の仕組みとフロー(暗黙的vsハイブリッド)を非常によく説明しています。 Identityの基本とそれがどのように連携するかを理解したら、 redux-oidcサンプル (非常に簡単に理解できます)を見てください。
楽しんで ;)