2017-12-05 6 views
1

ユーザーのための角度と実装の新機能です。ユーザーが認証した場合、角2(4/5)のチェック、ベストプラクティス

ウェブ上の提案のほとんどは、セッション/ユーザー名をローカルストレージに保存することを提案しています。ユーザーがアプリに戻ったときに、適切なナビゲーションを表示するためにローカルストレージを確認してください(私のnavbarでは、ビュー)。

ただし、この解決策にはいくつかの欠点があります。たとえば、サーバー上のセッションが期限切れになった場合、またはローカルストレージが手動で追加された場合、アプリケーションが初期化されると、navbarに間違ったボタンが表示されます。

その後、Navbarボタンを表示する前にサービスを使用して、セッションにローカルストレージからのユーザーが現在アクティブかどうかを確認するためにサーバーにリクエストを送信しました。それ以降は、ナビゲーションボタンが表示されます。

ここで疑問があります:ローカルストレージのユーザーがログインしてセッションがアクティブかどうかを確認する最も効率的な方法ですか?

私は考えていたが解決策を見いださなかった別の方法があります。 私の角度webappとnodejsサーバーは2つの異なる場所にあるので、index.htmlが要求されたときにwebappが認証ステータスを確認することができますか(webappサーバーからnodejsサーバーに要求を行います)、事前レンダリングされたnavbarユーザーステータス(ログインしているかどうか)

ありがとうございました。

P.S.私は、サーバー側でPassportJSとエクスプレスを使用しています。

+0

JWT認証を使用できます。ここではlocalstorageとサーバーセッションの同期は必要ありません。 https://blog.angular-university.io/angular-jwt-authentication/ –

答えて

0

AuthGuardを使用して、CanActivateを実装して、ユーザーがアプリケーションの特定の部分を表示できるかどうかを確認することをお勧めします。また、認証サービスは通常、ユーザーがシステムにログインしてアクセストークンを取得させるために使用されます。

このアクセストークンは、サーバーへの各要求(これが同期される場所)でAuthorisation-Headerとして使用されます。

ユーザー情報とセッションタイムアウトを含むJWT/or any other typeトークンが読み込まれていることを確認する必要があります。

トークンが無効な場合は、ユーザーをログインにリダイレクトするだけです。そうしないと、ユーザーは希望する場所に移動できます。

具体的な例はhereです。

関連する問題