Включение CORS в .net core Web API и Angular 6

Question

Здесь я использую HTTP-запрос POST от Angular 6, и он срабатывает при вызове Web-API ядра .net, но я не получаю ответный ответ обратно на Angular 6, и в консоли получена ошибка,:

"Доступ к XMLHttpRequest в« http://localhost:55654/api/login/auth' из источника »http://localhost:4200' заблокирован политикой CORS: заголовок« Access-Control-Allow-Origin »отсутствуетприсутствует на запрошенном ресурсе. "

Но я немного запутался, что, если это какая-либо проблема с разрешением доступа CORS, он не попадет в вызов веб-API.Но он отвечает на вызов API, и я не получаю ответ.

Angular 6 HTTP POST запрос:

this.http.post("http://localhost:55654/api/login/auth", credentials, {
  headers: new HttpHeaders({
 "Content-Type": "application/json"
      })
  }).subscribe(response => {
      let token = (<any>response);
      localStorage.setItem("jwt", token);
    }, err => {

    });

Я включил CORS в следующих методах в .NetCore Web API

Configure Метод в Startup.cs:

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

ConfigureServices Метод в Startup.cs:

...
services.AddCors();
...

Answer 1

В Startup.cs добавить в ConfigureServices:

services.AddCors();

Вкл. Настройка добавить

app.UseCors(x => x.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader());

Это решило вашу проблему

Answer 2

Как указано в комментариях:

Звонок на app.UseMvc должен быть ПОСЛЕ app.UseCors

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

app.UseMvc();
...

Answer 3

Я бы предложил добавить прокси для доступа к вашему бэкэнду. Просто добавьте прокси-файл (proxy.conf.json) в корневой каталог.

Служите вашему приложению с помощью: ng s --proxy-config [PathToProxy]

Например:

{
  "/api/*": {
    "target": "http://localhost:55654",
    "secure": false,
    "logLevel": "debug"
  }
}

https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md