問題タブ [angularjs-authentication]

Firebaseバックエンドを使用してAngularJSアプリに認証メカニズムを追加したいと思います。要件は単純です。

• 認証されたユーザーは、どのページにもアクセスできる必要があります。
• 認証されていないユーザーが/some_page（を除くすべてのページ/login）に移動した場合は、にリダイレクトする必要があります/login。適切なクレデンシャルを入力したら、にリダイレクトする必要があります/other_page。

ここで説明する可能な解決策は、次の仮定をします。

私のソリューションは、次のサーバー側の動作を想定しています。/ resources / *呼び出しごとに、ユーザーが許可されていない場合は、401ステータスに応答します。

ただし、Firebaseをバックエンドとして使用するときにこの動作を強制できるかどうかはわかりません。

このようなAngularJS+Firebase統合を実装するためのヘルプや例をいただければ幸いです。

私のアプリには2つのページがあります：main.htmlとlogin.html。認証されていないユーザーがアクセスする/main場合は、にリダイレクトする必要があります/login。

問題は、main.html最初にレンダリングされ、1秒ほど後に、ユーザー認証が失敗したときにlogin.htmlレンダリングされることです。

main.html認証が成功するまでレンダリングされないようにするにはどうすればよいですか？

関連するコード（CoffeeScript）は次のとおりです。

私はAngularを初めて使用します。現在、すべてのルートを設定して、希望どおりに機能させようとしています。

セットアップ： ユーザーが特定のページ（/settingsこの例の場合）に移動すると、アプリはユーザーが既にログインしているかどうかを確認する必要があります。ログインしている場合は、通常どおり続行します。それ以外の場合、ユーザーはログインページ（/login）に移動する必要があります。

欲しいもの： ユーザーが正常にログインした後、最初にアクセスしようとしていたページに移動する必要があります（/settings）

私の質問： ユーザーがどこに行こうとしていたかを覚える「角度のある方法」はありますか？

関連コード：

app.js

login.js

これまで私を導いてくれたビデオを提供してくれたJohnLindquistに感謝します。

外部サービスによるルートの簡単な認証チェックを作成したいと考えています。

ルート オブジェクトでアクセス要件を定義します。

次に、$routeChangeStartイベント内で許可があるかどうかを確認します。

実際、それは機能します-
ユーザーが認証されていない場合はログインページに移動し、認証されているがルートが匿名ユーザーのみの場合は別のページに移動します.

しかし、このリダイレクトは、コントローラーとテンプレートがロードされた後に実際に発生します! また、認証されていない場合でも、コントローラーが REST API に対して不要な要求を行う原因となります。

彼らが処理する前にルートを処理するにはどうすればよいですか?

ユーザーがルートにアクセスできるかどうかの基本的な検証を作成しようとしています。私はそれで進歩しましたが、理解できないことが1つあります。

$locationChangeStart を使用して、ルートの変更を監視しています。シナリオは次のとおりです。 1. ユーザーがログインしている場合、認証ルート (ログイン、登録) を除くすべてのルートへのアクセスを許可します。AuthFactory 2 からメソッド isAuthenticated() を呼び出してこれを確認しています。ユーザーがログインしていない場合、ユーザーはログインのみにアクセスしてルートを登録します。他のルートは防止する必要があり、その場合はユーザーをログインにリダイレクトする必要があります。

私を悩ませているのは、preventDefault() のものです。アプリが preventDefault() を使用してコードに到達した場合、location.path()それはその後に続き、単に機能しません。

ただし、を削除するevent.preventDefault()と、location.path()機能します。これに関する問題は、ログに記録されていない人が認証されていないページにアクセスしようとした場合に備えて、防止する必要があることです。

基本的に、リクエストされたルートに基づいて防止またはリダイレクトできるようにしたいと考えています。それを行う適切な方法は何ですか？

angularJS を使用して Web アプリの開発を開始しましたが、すべてが適切に保護されているかどうかはわかりません (クライアント側とサーバー側)。セキュリティは単一のログイン ページに基づいています。資格情報が正常にチェックされている場合、サーバーはカスタムの有効期限を持つ一意のトークンを返します。他のすべての REST API は、このトークンを介してアクセスできます。アプリケーション (クライアント) は、エントリ ポイントの例を参照します: https://www.example.com/home.htmlユーザーは資格情報を挿入し、一意のトークンを受け取ります。この一意のトークンは、AES またはその他の安全な技術を使用してサーバー データベースに保存されます。クリアな形式では保存されません。

これからは、AngluarJS アプリはこのトークンを使用して、公開されているすべての REST Api を認証します。

カスタム http Cookie にトークンを一時的に保存することを考えています。基本的に、サーバーが資格情報を検証すると、新しい Cookie Ex. が返されます。

Cookie には、セキュアおよびHTTP のみのフラグが設定されています。HTTP プロトコルは、新しい Cookie を直接管理して保存します。連続する要求は、Cookie を管理して JavaScript で保存する必要なく、新しいパラメーターを使用して Cookie を提示します。リクエストごとに、サーバーはトークンを無効にし、新しいトークンを生成してクライアントに送り返します --> 単一のトークンでリプレイ攻撃を防ぎます。

クライアントが REST Api から HTTP ステータス401 の無許可の応答を受信すると、Angular コントローラーはすべての Cookie を消去し、ユーザーをログイン ページにリダイレクトします。

他の側面を考慮する必要がありますか？トークンを新しい Cookie 内に保存するか、localStorage に保存する方がよいでしょうか? 独自の強力なトークンを生成する方法に関するヒントはありますか?

編集（改善）：

• セッション トークン ジェネレーターとして HMAC-SHA256 を使用することにしました。有効期間は 20 分です。ランダムな 32 バイトの GUID を生成し、タイムスタンプを添付し、40 バイトのキーを提供して HASH-SHA256 を計算します。トークンの有効性が非常に低いため、衝突を取得することはまったく不可能です。
• Cookie には、セキュリティを強化するためのドメインとパスの属性があります。
• マルチログインは許可されていません。

私は、yeoman、grunt、および bower を使用して作成された AngularJS アプリケーションを持っています。

認証をチェックするコントローラーを含むログイン ページがあります。資格情報が正しければ、ホームページにリダイレクトします。

app.js

LoginController.js

私が持っているホームページには

でloginController、ログイン情報を確認し、成功した場合は、サービス ファクトリにユーザー オブジェクトを設定します。これが正しいかどうかはわかりません。

私が必要とするのは、ユーザーがログインすると、ユーザーオブジェクトに値を設定して、他のすべてのページがその値を取得できるようにすることです。

ルートの変更が発生するたびに、コントローラーはユーザーがログインしているかどうかを確認する必要があります。そうでない場合は、ログイン ページに再ルーティングする必要があります。また、ユーザーがすでにログインしてページに戻ってきた場合は、ホームページに移動する必要があります。コントローラーは、すべてのルートの資格情報も確認する必要があります。

ng-cookies について聞いたことがありますが、その使用方法がわかりません。

私が見た例の多くはあまり明確ではなく、ある種のアクセス ロールか何かを使用しています。私はそれをしたくありません。ログインフィルターのみが必要です。誰かが私にいくつかのアイデアを与えることができますか?

私は、yeoman、grunt、bower を使用して angularJS アプリケーションを作成しました。簡単なログイン例を試しました。ログイン後、ホームページに飛びます。また、ルートが変更されると、ユーザーがログインしているかどうかがチェックされます。ログインしている場合は、ホームまたは特定のルートにリダイレクトされます。それ以外の場合は、ログイン ページに再ルーティングされます。これはすべて私にとってはうまくいきます。

ここにapp.jsがあります

ここに私のloginControler.jsがあります

すべてが私のためにうまくいっています。

私はうなり声を使用しているので、URLは次のようになります。ログインした後、または他のURLを入力http://localhost:9000/#/login すると、ホームページに移動します。ログアウトして任意のページを試すと、ログインに進みます。http://localhost:9000/#/loginhttp://localhost:9000/#/register

問題は、試してみるhttp://localhost:9000/か、タブを閉じてURLを再度開いたときにログインした後、ログインページに移動することです（loggedUserがnullであることを意味します）。

なぜそれが起こっているのですか？どうすれば解決できますか？

クッキーなどを設定する必要がありますか? もしそうなら、どのように？

Twitter API にリクエストを送信し、現在ログインしているユーザー フィードを取得したいと考えています。

「apigee」で Twitter API を試してみましたが、すべて正常に動作します。Authorization ヘッダーを「apigee」から「postman」にコピーしても、データが返されます。

しかし、Angular アプリで http リクエストを作成しようとすると、アプリ全体が機能しなくなります。ブラウザには "{{message}}" という出力だけが表示され、コンソールには次の 2 つのエラー メッセージが出力されます。

私のアプリのコードは次のようになります

誰かが私を助けたり、私が間違っていることを教えてくれますか? ケビン