Fazer uma chamada de API no VS Code é muito fácil, basta instalar uma extensão e você não precisará depender de nenhuma ferramenta externa para fazer o trabalho.

Durante o desenvolvimento, é comum você fazer requisições para APIs. Isso pode ser para alguma API externa ou para a API do seu próprio servidor de back-end.

Você pode usar ferramentas de terceiros como o Postman para realizar suas chamadas de API. Mas uma extensão do VS Code permite que você faça chamadas de API diretamente do VS Code. Aqui, você aprenderá como realizar solicitações de API no VS Code.

A extensão do cliente REST do VS Code

Uma extensão no VS Code é um plug-in ou complemento que aprimora as funcionalidades do editor do Visual Studio Code. O mercado de extensões do VS Code fornece vários tipos de extensões que podem ajudá-lo em suas tarefas de programação. Há uma extensão para adicionar suporte a idiomas. Existe um para fornecer preenchimento automático para uma linguagem de programação específica e assim por diante. As extensões facilitam a programação com o VS Code.

instagram viewer

A extensão REST Client permite que você execute solicitações de API de dentro do VS Code. A extensão inclui o editor de API REST, uma interface visual que permite consultar terminais de API. Ele aceita cabeçalhos personalizados, parâmetros de consulta e alguns outros parâmetros.

Para instalar o Cliente REST, abra o VS Code e clique no botão Extensões aba. Procurar Cliente REST e clique no Instalar botão para adicioná-lo ao VS Code.

Debaixo de Detalhes guia, você encontrará um tutorial útil sobre como usar o cliente para fazer solicitações de API. Vamos ver os quatro tipos comuns de requisições e como fazê-las usando a extensão REST Client.

nós estaremos usando JSONPlaceholder para demonstrar como fazer chamadas de API usando a extensão REST Client. Ele fornece seis recursos comuns que você pode ler, editar, atualizar ou excluir fazendo solicitações de API.

Fazendo uma solicitação GET usando a extensão do cliente REST

Comece criando um .http arquivo para suas solicitações de API. Você pode nomear o arquivo meuspedidos.http.

Adicione o seguinte código ao seu meuspedidos.http arquivo para recuperar um recurso da API JSONPlaceholder tendo 1 como seu ID:

PEGAR https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Para enviar a solicitação, clique no botão Enviar pedido botão que aparece na parte superior do arquivo. Uma nova janela será aberta contendo os detalhes da resposta.

É assim que você faz uma solicitação GET dentro do VS Code.

Fazendo uma solicitação POST usando a extensão do cliente REST

Você faz uma solicitação POST quando deseja postar dados no servidor, geralmente para criar um novo recurso.

Para criar um novo recurso na API JSONPlaceholder, substitua o código em seu meuspedidos.http arquivo com o seguinte:

PUBLICAR https://jsonplaceholder.typicode.com/posts HTTP/1.1
Tipo de conteúdo: "aplicativo/json"

{
"título": "foo",
"corpo": "barra",
"userId": 1
}

Clique no Enviar pedido botão para enviar a solicitação. Novamente, isso abrirá uma nova janela contendo os dados de resposta. A resposta mostra uma HTTP/1.1 201 Criado mensagem e o ID da postagem junto com outros dados se a chamada da API for bem-sucedida.

{
"id": "101"
}

Fazendo uma solicitação PUT usando a extensão do cliente REST

Você faz uma solicitação PUT quando deseja atualizar dados no servidor.

Para atualizar um recurso existente na API JSONPlaceholder, substitua o código em seu meuspedidos.http arquivo com o seguinte:

COLOCAR https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1
Tipo de conteúdo: "aplicativo/json"

{
"título": "novo foo",
"corpo": "nova barra",
"userId": 1
}

Após o envio da requisição, o recurso será atualizado no servidor fictício e você receberá um HTTP/1.1 200 OK mensagem.

Fazendo uma solicitação PATCH usando a extensão do cliente REST

Você faz uma solicitação PATCH quando deseja modificar um determinado campo ou propriedade de um determinado recurso no servidor.

Para atualizar apenas o título de um recurso existente no servidor fictício, substitua o código em seu meuspedidos.http arquivo com o seguinte:

https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1 
Tipo de conteúdo: "aplicativo/json"

{
"título": "outro foo"
}

Depois de fazer a solicitação, o título do recurso será atualizado no servidor fictício e você receberá um HTTP/1.1 200 OK mensagem junto com os demais dados do recurso.

Fazendo uma solicitação DELETE usando a extensão do cliente REST

Você faz uma solicitação DELETE quando deseja excluir um recurso no servidor.

Para excluir um recurso existente no servidor fictício, substitua o código em seu meuspedidos.http arquivo com o seguinte:

EXCLUIR https://jsonplaceholder.typicode.com/posts/1 HTTP/1.1

Aqui o Tipo de conteúdo não é necessário e nem o objeto de dados. Se você enviar a solicitação e excluir o recurso com êxito, deverá obter um HTTP/1.1 200 OK resposta com um objeto vazio.

Faça chamadas de API diretamente de dentro do código VS

Anteriormente, você pode ter usado ferramentas de terceiros como Carteiro para fazer solicitações de API. Embora essas ferramentas funcionem bem, leva tempo para configurá-las. Por exemplo, você precisa ter uma conta no Postman para usar o API Explorer.

Apesar de haver várias ferramentas de teste de API online, mas com extensões como o REST Client, testar APIs é muito mais rápido e fácil. Você pode testar qualquer API diretamente de dentro do seu editor VS Code. Isso é especialmente útil se você estiver desenvolvendo APIs localmente e quiser testar suas APIs locais em tempo real.

Outras extensões de código VS de teste de API

Rest Client é fácil de usar. Mas não é a única extensão do VS Code para testar APIs. Outras opções populares são Thunder Client, httpYak e httpBook.

O Thunder Client fornece um editor de API visual para simplificar as solicitações de API. Claro, você precisa saber o que é API REST para usar essas ferramentas.