Extensão Cliente Rest para Visual Studio Code

O fluxo de trabalho de desenvolvimento web está mudando rapidamente hoje em dia. Os usuários são preferidos para construir sites usando bibliotecas / frameworks JavaScript como React, Vue, Angular. Embora a construção de um site com essas tecnologias seja uma tendência, também é necessário chamar as APIs Rest para tornar seus aplicativos dinâmicos.

Seu aplicativo de front-end envia a solicitação HTTP para o servidor de back-end e obtém ou processa os dados. Para o seu servidor de back-end, pode ser necessário enviar diferentes solicitações HTTP, como GET, POST, PUT, DELETE. E com base nessas solicitações e respostas HTTP, seu aplicativo funciona para o usuário final.

Como você precisa criar endpoints de API, é óbvio que você precisa testar as solicitações HTTP. Existem várias ferramentas disponíveis que nos permitem testar solicitações e respostas HTTP. A boa notícia é que, se você estiver usando o Visual Studio Code, não precisará usar ou instalar nenhuma outra ferramenta ou software. Você pode testar suas chamadas de API dentro de seu próprio editor de código. Neste artigo, mostramos como usar a extensão Rest Client no Visual Studio Code.

Instale a extensão de cliente Rest no código do Visual Studio

O objetivo deste artigo é mostrar como o usuário pode testar a solicitação e a resposta HTTP no código do Visual Studio. Portanto, em primeiro lugar, você precisa instalar a extensão chamada “Rest Client".

Clique no ícone “Extensões" e no campo de pesquisa digite “Rest Client”. No resultado da pesquisa, escolha o pacote desenvolvido por “Huacho Mao” e instale-o.

Como testar solicitação e resposta HTTP

Nesta seção, vemos como enviar uma solicitação HTTP real e ver a resposta. Se você tiver seus endpoints de API prontos, poderá aplicá-los diretamente. Em nosso caso, para fins de teste, pegamos endpoints de REQ | RES.

Crie um arquivo com extensão “.http” como “api.http”. Você pode salvar este arquivo em qualquer lugar. Este é apenas um arquivo onde você pode armazenar todas as suas solicitações HTTP para uso posterior.

Para enviar uma solicitação GET, nosso endpoint é https://reqres.in/api/users?page=2. Então, no api.httpvamos escrever da seguinte maneira.

GET https://reqres.in/api/users?page=2

Agora, se você verificar no editor, verá a linha “Enviar solicitação” anexada ao nosso extrato. Clique em “Send Request” para atingir um endpoint da API e fornecer uma resposta HTTP na janela seguinte. Veja a imagem abaixo.

É muito mais simples. No futuro, você pode enviar a solicitação POST conforme abaixo.

POST https://reqres.in/api/users
Content-Type: application/json

{
    "name": "morpheus",
    "job": "leader"
}

Claro, você não deseja criar um arquivo separado para cada solicitação. Para separar a solicitação, pressione Enter e digite “###” e em uma nova linha adicione sua nova solicitação.

GET https://reqres.in/api/users?page=2

###
POST https://reqres.in/api/users
Content-Type: application/json

{
    "name": "morpheus",
    "job": "leader"
}

Dessa forma, você pode manter todas as suas solicitações HTTP em um único arquivo e testá-lo facilmente. Não há mais pressa em encontrar nosso pedido e usá-lo.

Em outro exemplo, você pode precisar passar o token em cada solicitação HTTP. Você pode fazer isso conforme mostrado abaixo.

POST https://reqres.in/api/users
Authorization: Bearer YOUR_TOKEN_HERE
Content-Type: application/json

{
  "user_id":5,
    "car_number":"030663",
    "car_reg_id":"217",
    "days": ["Monday", "Wednesday"],
    "booking_time": "07PM - 08PM"
}

Você teve a ideia, certo? Da mesma forma, você pode escrever suas solicitações PUT, DELETE HTTP. Vá em frente e experimente. Você definitivamente gostaria desta extensão. Gostaríamos de ouvir suas opiniões e sugestões na seção de comentários abaixo.

Artigos relacionados

• Extensão FTP / SFTP para código do Visual Studio
• Como dividir o terminal no sistema operacional Windows
• Como usar o pacote FTP / SFTP com texto sublime