Как развернуть Angular And .NET Core Web API на IIS?

Question

У нас есть два веб-сайта на IIS для angular_client и web_api, пакет хостинга установлен, и разрешение для таких пользователей, как IUSR, Сеть, Сетевая служба и Все, уже предоставлено.

Навигация докаждый сайт работает отдельно, т.е. в API, вызов http://localhost:51975/api/user, приводит к списку всех пользователей.

Проблема в том, что на странице входа в Angular не удается связаться с API для аутентификации пользователей:

OPTIONS http://localhost:51975/api/user/authenticate net::ERR_CONNECTION_REFUSED

Я попытался изменить IP-адрес, связанный с API, на статический, то есть 10.1.xy, а затем приказал angular вместо http://10.1.x.y:51975/api/user/authenticate.

В API, который я включил, отправлял журнал в браузер, а также в папку журналов, отображается только один журнал:

Hosting environment: Production
Content root path: C:\inetpub\wwwroot\api
Now listening on: http://127.0.0.1:39834
Application started. Press Ctrl+C to shut down.
Application is shutting down...

Почему он прослушивает другой порт, а не связанный 51975?

Почему отказано соединение от Angular к API?

Почему приложение закрывается?

Это правильный подход для этого?

ОБНОВЛЕНИЕ 1

На сервере ТОЛЬКО приложение работает нормально, со следующими конфигурациями:

1. Угловое на 10.xyz:4200,

2. API 10.xyz:51975,

Проблема в том, что когда я пытаюсь использовать публичный ip или имя хоста, я все ещеможет получить доступ только к угловому, но не к веб-API, я попытался назначить имя хоста для API, и он еще не работает!

ОБНОВЛЕНИЕ 2

Iтакже разрешил оба порта 4200 и 51975 в моем доменном имени хоста.

ОБНОВЛЕНИЕ 3

Я размещаю веб-API на IIS, API и Angularна том же сервере, но на разных веб-сайтах.

Я удалил утверждение о CORS исправлено, потому что у меня все еще есть предупреждение на консоли браузера, вот ошибка:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://{public IP}:51975/api/user/authenticate. (Reason: CORS request did not succeed).[Learn More]

Object { headers: {…}, status: 0, statusText: "Unknown Error", url: "http://{public IP}:51975/api/user/authenticate", ok: false, name: "HttpErrorResponse", 
 message: "Http failure response for http://{public IP}:51975/api/user/authenticate: 0 Unknown Error", error: error }


OPTIONS Http failure response for http://{public IP}:51975/api/user/authenticate net::ERR_CONNECTION_TIMED_OUT

О CORS,вот моя конфигурация, она работает локально:

 //In ConfigureServices method
 services.AddCors();

 //In Configure method
 app.UseCors(options => options.WithOrigins("http://localhost:4200/").AllowAnyMethod().AllowAnyHeader());

Спасибо

Answer 1

Ошибка CORS объясняет все, что вам нужно знать.Вам необходимо настроить CORS также для общедоступных IP-адресов и DNS, если вы используете также доступ по DNS-имени.Он должен быть настроен для того же URL-адреса, который вы используете для доступа к приложению Angular.

app.UseCors(options => 
   options.WithOrigins(
      "http://localhost:4200/",
      "http://{public IP}:{public port}/",
      "http://{public DNS name}:{public port}/"
   ).AllowAnyMethod().AllowAnyHeader());

Для адресов клиентов Angular требуются только параметры CORS, поскольку приложение Angular должно получить разрешение на отправку запросов CORS наваш веб-API.Он вызывает с публичного адреса, поэтому конфигурация localhost не помогает, это помогает, когда вы обращаетесь к нему локально с помощью localhost.

Здесь приведены ссылки на Angular документацию о CORS и Документация Microsoft, как включить CORS там, где это подробно описано.

Answer 2

Убедитесь, что вы создали правильные заголовки в своем API-запросе от Angular проекта.

как:

createHeader() {
let reqheaders = new HttpHeaders();
reqheaders.append('Access-Control-Allow-Methods', 'GET, POST, DELETE, PUT');
reqheaders.append('Access-Control-Allow-Origin', '*');

let reqHeader = { headers: reqheaders };
return reqHeader;
}

На стороне ядра .net:

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    app.UseCors(b => b.WithOrigins("http://localhost:8033", "http://localhost:8034","*").AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod());
    // app.UseCors("corspolicy");
    //app.UseSignalR(routes =>
    //{
    //    routes.MapHub<RealTimeHub>("/api/chat");
    //});
    app.UseMvc(routes =>
    {
        routes.MapRoute("default", "{controller=Home}/{action=Index}/{id?}");
    });
}

Answer 3

     services.AddCors(options =>
            {
                options.AddPolicy("CorsPolicy",
            builder => builder.WithOrigins("localhost").AllowAnyOrigin()
                              .AllowAnyMethod()
                              .AllowAnyHeader()
                              .AllowCredentials());
            });
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            app.UseCors("CorsPolicy");
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseMvc();

            app.UseAuthentication();

        }