ASP .NET Core  - Consumindo uma Web API com React - III


  Neste artigo vamos continuar criando a Web API ASP .NET Core para depois consumi-la usando uma aplicação React.

Continuando o artigo anterior vamos agora testar a nossa Web API para ter certeza que as implementações feitas estão funcionando corretamente.

Testando a API usando o Swagger

A grande vantagem em usar o Swagger, além de documentar melhor a sua API, é ter disponível uma interface para poder realizar os testes dos endpoints. Isso não impede que você use outras ferramentas como o Postman para realizar os testes.

Assim vamos usar a interface do Swagger que já esta implementada em nosso projeto para testar cada endpoint da nossa API.

Executando o projeto iremos visualizar no navegador a interface do Swagger apresentando os endpoints da nossa API conforme a figura abaixo:?

Vamos então iniciar os testes de cada endpoint.

1 - GET /api/Alunos  - Retornar todos os alunos

Clique neste endpoint , a seguir clique no botão - Try it out - e depois clique em Execute:

Veremos o resultado conforme a imagem abaixo onde vemos o Status Code 200 e os alunos retornados no body do response:

2 - GET /api/Alunos/{id} - Retornar um aluno pelo seu id

Repita o procedimento e agora informe o id do aluno a ser obtido e clique no botão Execute:

3 - POST /api/Alunos/{id} incluir um novo aluno

Para testar a inclusão de alunos usando o método POST temos que informar os dados do aluno a ser incluído no Body do Request no formato JSON:

{
   "nome": "Bianca Ribeiro",
   "email": "bibi@hotmail.com",
   "idade": 23
}

E clicar no botão Execute:

Obtemos o status code 201 e vemos o aluno criado com o Id atribuído e retornado graças ao uso do método  CreatedAtRoute("GetAluno", new { id=aluno.Id }, aluno); que retorna a URI para o novo recurso criado a partir do Location do Header.

O método CreatedAtRoute é usado para retornar um código 201, o que significa que o objeto foi criado.

[Microsoft.AspNetCore.Mvc.NonAction]
público virtual Microsoft.AspNetCore.Mvc.CreatedAtRouteResult CreatedAtRoute (string routeName, object routeValues, object content);


Como você pode ver acima, o CreatedAtRoute pode receber 3 parâmetros:

1- routeName É o nome que você deve colocar no método que será a URI que obterá esse recurso depois de criado;
2- routeValues É o objeto que contém os valores que serão passados ao método GET na rota nomeada. Será usado para retornar o objeto criado
3- content - É o objeto que foi criado.

4 - PUT /api/Alunos/{id} atualizar os dados de um aluno

Para testar o PUT temos que informar o Id do aluno que desejamos alterar e também enviar no Body do Request os dados a serem alterados. O verbo PUT exige que enviemos todos os dados, mesmo os que não serão alterados incluindo o Id do aluno:

Ao clicar no botão Execute teremos a mensagem da resposta e o status code 200:

4 - DELETE /api/Alunos/{id} deletar um aluno pelo seu id

Para excluir um recurso usando este endpoint informamos o id do aluno e ao clicar no botão Execute obtemos a mensagem e o status code 200:

5 - GET /api/Alunos/AlunosPorNome

No último endpoint vamos informar uma string como critério e será retornado todos os alunos cujos nomes possuírem a string informada.

Assim informando a string 'Ma' e clicando em Execute iremos obter o resultado abaixo:

Com isso verificamos que todos os endpoints estão funcionando corretamente e agora podemos iniciar a criação da aplicação React para consumir a nossa API.

Pegue o projeto da API aqui :  AlunosApi_2.zip

Referências:


José Carlos Macoratti