2017-03-12 16 views
0

私は簡単な設定をしています。 Angular2クライアントとドットネットコアwebapiサーバー必須のWindows認証、ログイン/登録ページはありません。 クライアント側では、現在のユーザーに特定の権限があるかどうかを知る必要があります。彼がユーザー、パワーユーザー、または管理者になることができるとしましょう。これらの役割は、Active Directory(特定のグループのメンバーですか?それ以外のもの)を介して割り当てる必要があります。 質問は、クライアント側でどのようにユーザーの役割を取得できますか?角度2&ドットネットコア統合Windows認証

は、これまでのところ(index.htmlのための)最初の要求は次のようになります。

Request URL:http://localhost:5000/ 
Request Method:GET 
Status Code:200 OK 
Remote Address:[::1]:5000 

Response Headers: 
Accept-Ranges:bytes 
Access-Control-Allow-Origin:* 
Content-Encoding:gzip 
Content-Type:text/html 
Date:Sat, 11 Mar 2017 23:00:17 GMT 
ETag:"1d29abb3a9b8e62" 
Last-Modified:Sat, 11 Mar 2017 23:00:08 GMT 
Persistent-Auth:true 
Server:Kestrel 
Transfer-Encoding:chunked 
Vary:Accept-Encoding 
WWW-Authenticate:Negotiate oRswGaADCgEAoxIEEAEAAAAgBHIw6Z3ltQAAAAA= 
X-Powered-By:ASP.NET 
X-SourceFiles:=?UTF-8?B?QzpcUHJvamVjdHNcSGxyXFplbml0aFxaZW5pdGguV2Vi?= 
X-StackifyID:V1|a92d413d-a6f2-41f5-82d4-d561bcfb7ea4| 

Request Headers: 
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 
Accept-Encoding:gzip, deflate, sdch, br 
Accept-Language:en-US,en;q=0.8 
Authorization:Negotiate oXcwdaADCgEBoloEWE5UTE1TU1AAAwAAAAAAAABYAAAAAAAAAFgAAAAAAAAAWAAAAAAAAABYAAAAAAAAAFgAAAAAAAAAWAAAABXCiOIKADk4AAAAD2dOupNeJw531jZD2IvezcmjEgQQAQAAAF0+6pxdYvmTAAAAAA== 
Cache-Control:no-cache 
Connection:keep-alive 
Cookie:_ga=GA1.1.1850763475.1487368913 
Host:localhost:5000 
Pragma:no-cache 
Upgrade-Insecure-Requests:1 
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 

秒1:

Request URL:http://localhost:5000/inline.bundle.js 
Request Method:GET 
Status Code:200 OK 
Remote Address:[::1]:5000 

Response Headers: 
Accept-Ranges:bytes 
Access-Control-Allow-Origin:* 
Content-Encoding:gzip 
Content-Type:application/javascript 
Date:Sat, 11 Mar 2017 23:00:18 GMT 
ETag:"1d29abb3a9b9a84" 
Last-Modified:Sat, 11 Mar 2017 23:00:08 GMT 
Persistent-Auth:true 
Server:Kestrel 
Transfer-Encoding:chunked 
Vary:Accept-Encoding 
X-Powered-By:ASP.NET 
X-SourceFiles:=?UTF-8?B?QzpcUHJvamVjdHNcSGxyXFplbml0aFxaZW5pdGguV2ViXGlubGluZS5idW5kbGUuanM=?= 
X-StackifyID:V1|9ab31082-9a9d-4513-8e8c-ae83e8163117| 

Request Headers: 
Accept:*/* 
Accept-Encoding:gzip, deflate, sdch, br 
Accept-Language:en-US,en;q=0.8 
Cache-Control:no-cache 
Connection:keep-alive 
Cookie:_ga=GA1.1.1850763475.1487368913 
Host:localhost:5000 
Pragma:no-cache 
Referer:http://localhost:5000/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 

そしてWEBAPIのための1:

Request URL:http://localhost:5000/mymethod 
Request Method:GET 
Status Code:200 OK 
Remote Address:[::1]:5000 

Response Headers: 
Access-Control-Allow-Origin:* 
Content-Type:application/json; charset=utf-8 
Date:Sat, 11 Mar 2017 23:00:19 GMT 
Persistent-Auth:true 
Server:Kestrel 
Transfer-Encoding:chunked 
X-Powered-By:ASP.NET 
X-SourceFiles:=?UTF-8?B?QzpcUHJvamVjdHNcSGxyXFplbml0aFxaZW5pdGguV2ViXGFwaVxjb25maWd1cmF0aW9uXHZlcnNpb24=?= 
X-StackifyID:V1|0f198f5d-a0fe-4e6c-974a-bd31f0d32ec6| 

Request Headers: 
Accept:application/json, text/plain, */* 
Accept-Encoding:gzip, deflate, sdch, br 
Accept-Language:en-US,en;q=0.8 
Cache-Control:no-cache 
Connection:keep-alive 
Cookie:_ga=GA1.1.1850763475.1487368913 
Host:localhost:5000 
Pragma:no-cache 
Referer:http://localhost:5000/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 

どのようなアプローチを使用してユーザーのアクセス権を取得し(クライアント側でそれらを維持する...)、それらをルートガードに使用することができますか?

また、ページが読み込み中にいくつかのwebapi呼び出しを行うこともあります。すべての通話を許可するのか、以前の通話結果を使用するのか

ありがとうございます。

答えて

1

私はこの記事がangularjsのための素晴らしい出発点だと思います&統合Windows認証。あなたの2番目の質問は、ユーザー名、役割、有効期限で暗号化されたトークンを使用して、すべての要求に、このトークンサーバ側の暗号化を解除し、それをサーバ側を使用することができますについて

CodeProject : AngularJS-Web-API-Active-Directory-Security

また、セッション情報を更新するために、リクエストごとにトークンを更新し、クライアントに再送信することもできます。

+0

Angular2または.netコアを使用していないにもかかわらず良い記事です。 しかし、私は実際には、ユーザーが特定の役割や権限を持っているかどうかをクライアント側に知らせる方法を模索しているので、ルートを保護することができます。 – rook

+0

最終的な解決策、本当に興味深い問題について教えてください。 –

1

本当にあなたの認証としてADグループを使用したい場合は、webapiメソッドを通してADを照会するアクセス許可サービスを設定し、熱く観測可能なものを使用してADを絶えず再クエリする必要なしに許可を広めたいでしょう。あなたのWEBAPI法で

public List<string> GetUserPermissions(){ 
    List<string> permissionsList = new List<string>(); 
    if (User.IsInRole("PowerUsers")){ 
     permissionsList.Add("PowerUsers"); 
    } 
    if (User.IsInRole("Admin")) { 
     permissionsList.Add("Admin"); 
    } 
    if (User.IsInRole("User")) { 
     permissionsList.Add("User"); 
    } 
    return permissionsList; 
} 

基本的に、あなたはあなたの許可サービスで以下の線に沿って何かをしたいと思うでしょう:あなたのapp.component ngInit(で

permissions: any[] = []; 

initPermissions(): void { 
    this.getPermissions().subscribe(perms => this.permissions = perms); 
} 

getPermissions(): Observable<any> { 
    return this.http.get(`${this.baseUrl}/api/Permissions/GetUserPermissions`) 
      .publishLast().refCount(); 
} 

isInRole(roleName: string): boolean{ 
    return this.permissions.some(perm => perm === roleName); 
} 

)サービスからinitPermissions()メソッドを呼び出します。

次に、あなたは、あなたがそれを使用するコンポーネントへのアクセス権のサービスをインポートコンストラクタprivate permissions: permissionsServiceでアクセス許可を作成し、機能を非表示にし、認証ガードとその他もろもろの内部で使用する*ngIf="permissions.isInRole('Admin')"のようなクールなものを行うことができますする必要があります。あなたはおそらく、まだあなたのデータを保護するためにあなたのWeb APIのメソッドで承認デコレータを使用したいと思うでしょう。

上記は私の実際のパーミッションコードではないので、動作させるにはデバッグする必要があるかもしれないことに注意してください。おそらくそれを改善したいと思うでしょう。それは単にあなたにいくつかのアイデアを与えることです。