web-dev-qa-db-ja.com

Angularjsアプリで安全な（！）認証システムを実現する方法は？

Angularjsを初めて使用します...

私はドキュメントを読み、チュートリアルを完了しました。私も自分で何かを試してみましたが、物事は私にとって理にかなっています。

今、私は安全な認証システムを作る方法を疑問に思います。

簡単な部分：コードなし、コードが実行する操作を説明します：

私は古典的なフォームを持っています：ユーザー名とパスワードのテキスト入力。

ユーザーがフォームに入力し、Enterキーを押します。

Ajaxリクエストが開始され、レスポンスはJSONで、「あなたを知っています」または「あなたが誰なのかわかりません」のようなものを教えてくれます。

今必要なのは、アプリケーションのさまざまなビュー間で訪問者のログ状態を保持することです（または、ログに記録しません）

この目的を達成するために、誰かが変数を設定し（$ scope.isLogged = true）、他の誰かがCookieを使用することをインターネットで読みました。ただし、javascript変数およびcookieは、firebugまたは類似の開発ツールを使用して簡単に編集できます。

...そして最後に質問：

angularjsアプリで安全な認証システムを実現するための提案はありますか？

javascriptsecurityauthenticationcookiesangularjs
57
Bruno

ユーザーは実行環境（つまり、ブラウザー）を完全に制御できるため、angularjsでは何も認証できません。各チェック、ケース、-あなたが考えることができるものなら-改ざんすることができます。非対称キーを使用してローカル暗号化を実行し、ローカルデータをある程度安全に保存するJavaScriptライブラリがありますが、実際には探しているものではありません。

セッションを使用して、サーバー上のもの（通常のアプリケーションで行う標準的な方法）を許可することができます。特別なコードは必要ありません。ajax呼び出しは通常のセッションCookieを使用します。アプリケーションは、認証されているかどうかを知る必要はありません。サーバーが何を考えているかを確認するだけです。

Angularjsアプリケーションの観点から見ると、「ログイン」または「ログアウト」することは、ユーザーに対するGUIのヒントにすぎません。

54
fdreger

おそらくあなたは解決策を見つけましたが、現在、Angularアプリで実装している認証スキームを作成しました。

.runで、アプリはActiveSessionがfalseに設定されて登録されます。次に、ブラウザにトークンとuserIdを持つCookieがあるかどうかを確認します。

YESの場合、サーバーのtoken + userIdを確認し、サーバーとローカルの両方でトークンを更新します（トークンは、ユーザーごとに一意のサーバー生成キーです）

ログインフォームが表示されない場合は、資格情報を確認し、資格情報が有効である場合、サーバーは新しいトークンを取得するよう要求し、ローカルに保存します。

トークンは、永続的なログイン（3週間記憶）またはユーザーがブラウザページを更新するときに使用されます。

ありがとうございました

Authentication Scheme in Angular.js

47
Alexandru R

3か月前にこの質問をしました。

AngularJS上に構築されたWebアプリでユーザー認証を処理するときに、私のお気に入りのアプローチになったものを共有したいと思います。

もちろん、fdregerの答えはまだ素晴らしい答えです！

ユーザーは実行環境（つまり、ブラウザー）を完全に制御できるため、angularjsでは何も認証できません。

Angularjsアプリケーションの観点から見ると、「ログイン」または「ログアウト」することは、ユーザーに対するGUIのヒントにすぎません。

したがって、簡単に私のアプローチは次のとおりです。

1）各ルートにバインドし、ルート自体に関する追加情報を提供します。

$routeProvider.when('/login', { 
    templateUrl: 'partials/login.html', controller: 'loginCtrl', isFree: true
});

2）サービスを使用して、各ユーザーに関するデータとその認証ステータスを保持します。

services.factory('User', [function() {
    return {
        isLogged: false,
        username: ''
    };
}]);

3）ユーザーが新しいルートにアクセスしようとするたびに、アクセス許可が付与されているかどうかを確認します。

$root.$on('$routeChangeStart', function(event, currRoute, prevRoute){
    // prevRoute.isFree tell me if this route is available for all the users, or only for registered user.
    // User.isLogged tell me if the user is logged
})

また、ブログで angularjsによるユーザー認証 で、このアプローチについて（詳細は）書いています。

18
Bruno

まず第一に、クライアント側のデータはいつでも操作または改ざんすることができます。

有効なセッションIDを簡単に推測できず、セッショントークンをクライアントのIPに関連付けるなどの手段を講じている限り、大したことはありません。

理論的には、サーバー側で暗号化する限り、Cookieも暗号化できます。

Cookieの暗号化方法の詳細については、サーバー側のドキュメントを参照してください（例： http://expressjs.com/api.html#res.cookie Express.jsの場合）

4
geekonaut

サーバー側/データベース側について知る必要があります。

ユーザーログインはどこかに保存する必要があります-これはサーバー側のデータベースにある時間の99.9％です。

本当に安全なシステムには、暗号化されたパスワードを保持するメンバーテーブルに関連するデータベーステーブルにセッションを格納するバックエンド（サーバー側）メンバーシップシステムが必要ですが、API呼び出しを構築できるRESTfulインターフェイスも提供することが理想的ですに。

私がよく使用したスクリプトの1つは、Amember https://www.amember.com/ です。他にも多くのスクリプトがありますが、本当に費用対効果の高い方法です。このスクリプトで多くの成功を収めました。また、PHPなのでビルドをビルドできますangular http呼び出しのためのAPIを簡単に作成できます。

これらのjavascriptフレームワークはすべて素晴らしいですが、結果として、多くの人が物事のフロントエンドに集中しすぎています-データベース/バックエンドも学びましょう！ :-)

0
webmaster_sean