400 неверных запросов от WebApi в Angular 9 (с использованием HttpClient) - PullRequest
0 голосов
/ 30 марта 2020

Ниже приведен Asp. net Базовый WebAPI, который возвращает неверный запрос. Он успешно работает, когда я вызываю веб-API через почтальона. но он не работает, когда я звоню с angular.

    [HttpPost]
    [Route("Login")]
    public async Task<ActionResult> Post([FromBody]LoginCommand command)
    {
        var result = await Mediator.Send(command);

        if (!result.Succeeded)
        {
            return BadRequest(result.Errors);
        }

        return Ok(result.Data);
    }

Ответ обрабатывается на стороне Angular следующим образом:

login.services.ts

login(input: Login): Observable<any> {
let result;
this.apiService.post(this.loginPath, input).subscribe(
  data => {
    result = data;
    console.log("This should be the response???: ", data);
  },
  err => {
    console.log("err: ", err);
  });
return result;

}

api.services.ts

post(url: string, data: Object = {}): Observable<any> {

const headers = { 'Accept': '*/*', 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, HEAD','Content-Type': 'application/json', 
'Access-Control-Allow-Headers': 'X-Requested-With,content-type' }

let result = this.http.post<any>(`${this.apiURL}${url}`, JSON.stringify(data), { headers });
console.log(result);
return result;

}

Сообщения об ошибках консоли:

enter image description here

Сеть:

enter image description here

1 Ответ

1 голос
/ 31 марта 2020

Вам необходимо настроить CORS в своем asp. net основном веб-проекте API startup.cs, добавьте app.UseCors() между app.UseRouting() и app.UseEndpoints(), если вы используете asp. net core 3.0 +:

app.UseRouting();

app.UseCors( builder => 
{ 
  builder.WithOrigins("https://localhost:5001")   
         .AllowCredentials() 
         .AllowAnyMethod() 
         .AllowAnyHeader(); 
});

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllers();
});

См. https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-3.1#cors с именованным программным обеспечением и промежуточным ПО

...