Получение ошибки политики CORS с использованием Identity Server и приложения Angular

Question

Я получаю сообщение об ошибке CORS при попытке получить доступ к конечной точке Web.API. У меня есть приложение agular, сервер идентификации для аутентификации и web.api для управления данными.

API работает на порте:52177, Angular APP на:52178 и IS4 на:4165.

Вот конфигурация IS

new Client {
                    RequireConsent = false,
                    ClientId = "angular_spa",
                    ClientName = "Angular SPA",
                    AllowedGrantTypes = GrantTypes.Implicit,
                    AllowedScopes = { "openid", "profile" },
                    RedirectUris =
                    {
                        "http://localhost:52178/auth-callback"
                    },
                    PostLogoutRedirectUris = {"http://localhost:52178/?logout=true"},
                    AllowedCorsOrigins =
                    {
                        "http://localhost:52178",
                        "http://localhost:52177"
                    },
                    AllowAccessTokensViaBrowser = true,
                    AccessTokenLifetime = 3600,
                    IdentityTokenLifetime = 3600
                }

Угловое приложение

 return {
            authority: 'http://localhost:4165',
            client_id: 'angular_spa',
            redirect_uri: 'http://localhost:52178/auth-callback',
            post_logout_redirect_uri: 'http://localhost:52178/?logout=true',
            response_type: "id_token token",
            scope: "openid profile",
            filterProtocolClaims: true,
            loadUserInfo: true,
            automaticSilentRenew: true

        };

API

app.UseIdentityServerBearerTokenAuthentication(new IdentityServerBearerTokenAuthenticationOptions
            {
                Authority = "http://localhost:4165",
                RequiredScopes = new[] { "openid", "profile" },
                PreserveAccessToken = true,

                NameClaimType = System.Security.Claims.ClaimTypes.Name,
                RoleClaimType = System.Security.Claims.ClaimTypes.Role
            });

Это ошибка, которую я получаю

Access to XMLHttpRequest at 'http://localhost:52177/api/books?length=0&pageIndex=0&pageSize=10' from origin 'http://localhost:52178' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Я добавил оба:52178 и: 52177 Происхождение к конфигурации клиента для IS4, но он все еще не работает. Есть идеи, что мне не хватает?

Answer 1

Как упоминал @mackie, в самом API должен быть включен CORS. Мне пришлось установить Install-Package Microsoft.AspNet.WebApi.Cors и в WebApiConfig включить CORS для моего клиентского приложения.

var cors = new EnableCorsAttribute("http://localhost:52178", "*", "*");
config.EnableCors(cors);