2017-08-30 7 views
0

私は、認証のためにOpenIdConnectと共にIdentityServer4を使用するようにセットアップされたASP.Netコア1.Xアプリケーションを持っています。WebAPI + IdentityServer4 CORSエラーを使用したAngular4

私はサービスを実行し、これは正しく認証用のIDサーバに私をリダイレクトして、戻りを評価http://localhost:xxx/api/mycontroller/myresourceに行きブラウザを使用しています。

は今、私はAngular4ファイルを追加し、それを起動したとき、それは予想通りのページを示しているが、要求はangularjsからhttp://localhost:xxx/api/mycontroller/myresourceに行われたとき、私は私のブラウザのコンソール上CORSエラーを取得します。

XMLHttpRequest cannot load http://localhost:5000/connect/authorize?client_id=system.health.check&redirect_uri=http%3A%2F%2Flocalhost%3A64886%2Fsignin-oidc&response_type=code%20id_token&scope=openid%20profile%20roles%20hierarchy%20healthcheck&response_mode=form_post&nonce=636396863541493382.OTI5NmUxOTYtYzE4Mi00MTY3LTgwYTYtNjlhYzhkNDQxYTY3MTYxNzI2MDUtOWM1Yy00MGExLWE2NTEtNmZjZmRjZmNjMmYz&state=CfDJ8HLk2yX8N6hEj4-UtnTRPL4rvxklhhFhg_Yc-8iFJwSP06FoI_9lUwaFJacx2xU81KDenMUSbsVAjF5QowMT_xRL2Z9mWyxFRykvBASUGB3mHk0RjaSCJzjYXtAYTbkbDF0wLzwALBTcaJ2tgwOwuG_vLWr2dAeiLyyqTiSVZqFziwssoMM_a9PXNAobGPHwl125pMihgXZxoylghIa0N_oS_4sswGCAr_kzW7cc9EMHFmApJTy7Yv29wUB4Tp2ddorOBKxt2t4-YqunsqHViKtlx-xUo0jFcuh30ZY4LDz90wLlHDvGkk_xYCqfJFBMaveNQAG5crvoPIiOYQcVJzNQMAzvXM7Z326E7pzVFVa-. Redirect from 'http://localhost:5000/connect/authorize?client_id=system.health.check&redirect_uri=http%3A%2F%2Flocalhost%3A64886%2Fsignin-oidc&response_type=code%20id_token&scope=openid%20profile%20roles%20hierarchy%20healthcheck&response_mode=form_post&nonce=636396863541493382.OTI5NmUxOTYtYzE4Mi00MTY3LTgwYTYtNjlhYzhkNDQxYTY3MTYxNzI2MDUtOWM1Yy00MGExLWE2NTEtNmZjZmRjZmNjMmYz&state=CfDJ8HLk2yX8N6hEj4-UtnTRPL4rvxklhhFhg_Yc-8iFJwSP06FoI_9lUwaFJacx2xU81KDenMUSbsVAjF5QowMT_xRL2Z9mWyxFRykvBASUGB3mHk0RjaSCJzjYXtAYTbkbDF0wLzwALBTcaJ2tgwOwuG_vLWr2dAeiLyyqTiSVZqFziwssoMM_a9PXNAobGPHwl125pMihgXZxoylghIa0N_oS_4sswGCAr_kzW7cc9EMHFmApJTy7Yv29wUB4Tp2ddorOBKxt2t4-YqunsqHViKtlx-xUo0jFcuh30ZY4LDz90wLlHDvGkk_xYCqfJFBMaveNQAG5crvoPIiOYQcVJzNQMAzvXM7Z326E7pzVFVa-' to 'http://localhost:5000/account/login?returnUrl=%2Fconnect%2Fauthorize%2Flogin%3Fclient_id%3Dsystem.health.check%26redirect_uri%3Dhttp%253A%252F%252Flocalhost%253A64886%252Fsignin-oidc%26response_type%3Dcode%2520id_token%26scope%3Dopenid%2520profile%2520roles%2520hierarchy%2520healthcheck%26response_mode%3Dform_post%26nonce%3D636396863541493382.OTI5NmUxOTYtYzE4Mi00MTY3LTgwYTYtNjlhYzhkNDQxYTY3MTYxNzI2MDUtOWM1Yy00MGExLWE2NTEtNmZjZmRjZmNjMmYz%26state%3DCfDJ8HLk2yX8N6hEj4-UtnTRPL4rvxklhhFhg_Yc-8iFJwSP06FoI_9lUwaFJacx2xU81KDenMUSbsVAjF5QowMT_xRL2Z9mWyxFRykvBASUGB3mHk0RjaSCJzjYXtAYTbkbDF0wLzwALBTcaJ2tgwOwuG_vLWr2dAeiLyyqTiSVZqFziwssoMM_a9PXNAobGPHwl125pMihgXZxoylghIa0N_oS_4sswGCAr_kzW7cc9EMHFmApJTy7Yv29wUB4Tp2ddorOBKxt2t4-YqunsqHViKtlx-xUo0jFcuh30ZY4LDz90wLlHDvGkk_xYCqfJFBMaveNQAG5crvoPIiOYQcVJzNQMAzvXM7Z326E7pzVFVa-' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:64886' is therefore not allowed access.

IdentityServer4上のログが表示さしかし enter image description here

はところでhttp://localhost:5000は私のIdentityServer4アドレスで、http://localhost:64886は角ファイルを提供し、WebAPIのをホスティングサービスです。

私はここで何が不足している可能性がありますか?

UPDATE 1このことができますが、私は私のHomeController[Authorize]属性に入れた場合、私のOpenIdConnectOption

"OpenIdConnectOptions": { 
    "AuthenticationScheme": "oidc", 
    "SignInScheme": "Cookies", 
    "Authority": "http://localhost:5000", 
    "RequireHttpsMetadata": false, 
    "ClientId": "system.health.check", 
    "ClientSecret": "secret", 
    "ResponseType": "code id_token", 
    "GetClaimsFromUserInfoEndpoint": true, 
    "SaveTokens": true, 
    "Scope": [ "roles", "hierarchy", "healthcheck" ] 
}, 

UPDATE 2

以下のように設定されている場合

わかりませんAngularファイルが表示される前でもログインページにリダイレクトされるので、期待どおりに動作します。 MVAPが初めて認可されない限り、WebAPIコントローラを保護することはできません。この場合CORSエラーが発生するのはなぜですか。

よろしく キラン

答えて

0

私は同じ問題に遭遇したとにHomeController上の[オーソライズ]を使用して終了していますが、角度のアプリケーション内で許可したい場合は、同様に角度内

を行うことができますクライアントのGrant Typeを "Implicit"に切り替え、javascriptライブラリでoidcを実行する必要があります。また、アングルアプリではコードのプライベートバックチャンネルを開くことができないため、responseTypeを "code id_token"から "id_token"に変更する必要があります。

OIDC JavaScriptクライアント: https://damienbod.com/2016/10/01/identityserver4-webapi-and-angular2-in-a-single-asp-net-core-project/

+0

私は、これはすでに持っているAPI呼び出しが行われたときに、角度が初期化されると失敗し、なぜ私は理解して考える:ここ https://github.com/IdentityModel/oidc-client-js

は、あなたのアプローチを説明する記事ですUIがどのように見えるかについての意見です。そのため、別の画面にリダイレクトされた場合、戻ってくることはできません。しかし、なぜ私はCORSを取得しません。 – Kiran

+0

Ajax/XHRリクエスト内のリダイレクトが原因である可能性があります。アイデンティティ・サーバーのクライアント・セットアップで起点を許可しようとしましたか? http://docs.identityserver.io/en/release/topics/cors.html – wheeler

関連する問題