Question

我有一个ASP.Net核心1.X应用程序，它设置为使用IdentityServer4和OpenIdConnect进行授权。

当我运行该服务时，使用浏览器转到http://localhost:xxx/api/mycontroller/myresource这正确地将我重定向到身份服务器进行授权，然后返回值。

现在当我添加 Angular4 文件并启动它时，它会按预期显示页面，但是当我从http://localhost:xxx/api/mycontroller/myresource请求angularjs时我的浏览器控制台上出现 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上的日志显示

BTW http://localhost:5000是我的IdentityServer4地址，http://localhost:64886是服务Angular文件并托管WebAPI的服务。

我在这里可能缺少什么想法？

更新1

不确定这是否有帮助，但我的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" ]
},

更新2

如果我在[Authorize]上放置了HomeController属性，那么即使在显示Angular文件之前，我也会将其重定向到登录页面。这是否意味着除非MVC首次获得授权，否则我无法保护WebAPI控制器？另外，为什么在这种情况下会出现CORS错误。

此致基兰

Answer 1

我遇到了同样的问题并最终使用HomeController上的[Authorize]，但你也可以在Angular中做到这一点

如果要在Angular应用程序中进行授权，则必须将客户端Grant Type切换为“Implicit”，并使用javascript库执行oidc。您还必须将responseType从“code id_token”更改为“id_token”，因为在角度应用中，您无法为代码打开私有反向通道。

OIDC Javascript客户端： https://github.com/IdentityModel/oidc-client-js

这是一篇解释您的方法的文章： https://damienbod.com/2016/10/01/identityserver4-webapi-and-angular2-in-a-single-asp-net-core-project/

WebAPI + Angular4使用IdentityServer4 CORS错误

1 个答案: