Доступ к методу API из источника заблокирован политикой CORS - PullRequest
0 голосов
/ 06 мая 2019

Я использую .Net Core для создания API и Angular Web-приложения для использования этих API. Оба размещаются локально с разными портами.

.Net Core API: http://localhost:5000

Angular Web App: http://localhost:4444

Вот мои методы обслуживания в Angular

export class AdvertisementService {
  // Define API 
  apiURL = environment.apiUrl;

  constructor(private http: HttpClient) {}

  // Configure HTTP Options
  httpOptions = {
    headers: new HttpHeaders({
      'Content-Type': 'application/json'
    })
  }

  // HttpClient API get() method => Fetch Advertisement List.
  getAdvertisements(): Observable<Advertisement[]> {
    return this.http.get<Advertisement>(this.apiURL + '/Advertisements')
                    .pipe(retry(1),catchError(this.handleError))
  }

  // HttpClient API post() method => Create Advertisement
  createAdvertisement(advertisement): Observable<Advertisement> {
    return this.http.post<Advertisement>(this.apiURL + '/Advertisements', JSON.stringify(advertisement), this.httpOptions)
    .pipe(retry(1),catchError(this.handleError))
  }  

  private handleError(error: any): Promise<any> {
    console.error('An error occurred', error); // for demo purposes only
    return Promise.reject(error.message || error);
  }
}

Когда я вызываю методы API через Angular App, выдается следующее сообщение об ошибке:

Доступ к XMLHttpRequest по адресу 'http://localhost:5000/api/Advertisements' от происхождения 'http://localhost:4444' заблокирован политикой CORS: Запрос Тип содержимого заголовка поля не разрешен Access-Control-Allow-Headers в предполетном ответе.

Я добавил CORS в свое .Net Core, как показано ниже в ConfigureServices метод:

 services.AddCors(options =>
 {
     options.AddPolicy(MyAllowSpecificOrigins,
     builder =>
     {
         builder.WithOrigins("http://localhost:4444");
     });
 });

Ответы [ 3 ]

1 голос
/ 06 мая 2019

добавить services.AddCors(); в методе ConfigureServices и app.UseCors(x => x.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod()); в методе Configure при запуске.cs

0 голосов
/ 07 мая 2019

Согласно решению, указанному в этой ссылке , для меня работает следующее.

readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

public void ConfigureServices(IServiceCollection services)
{ 
    services.AddCors(o => o.AddPolicy(MyAllowSpecificOrigins, builder =>
    {
        builder.AllowAnyOrigin()
               .AllowAnyMethod()
               .AllowAnyHeader();
    }));
}

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors(MyAllowSpecificOrigins);
}
0 голосов
/ 06 мая 2019

Включить CORS в WebApi.config:

var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
...