Neste artigo você vai aprender a como cancelar um request HTTP com fetch, vamos utilizar um recurso muito interessante
Fala programador(a), beleza? Bora aprender mais sobre JavaScript!
O Fetch API é uma forma padrão e moderna de realizar requisições HTTP em JavaScript.
No entanto, nem sempre é desejável que todas as requisições sejam concluídas.
Algumas vezes, pode ser necessário cancelar uma requisição antes que ela seja concluída.
Neste artigo, vamos explorar como cancelar um request HTTP com o Fetch API.
Antes de entrar em detalhes sobre o cancelamento de requisições com o Fetch API, é importante entender que o Fetch API não oferece suporte nativo para o cancelamento de requisições.
No entanto, existem algumas maneiras de implementar o cancelamento de requisições com o Fetch API.
Uma maneira de cancelar uma requisição com o Fetch API é usando o objeto AbortController.
O AbortController é uma classe que fornece uma forma de cancelar uma requisição antes que ela seja concluída.
Aqui está um exemplo de como usar o AbortController para cancelar uma requisição com o Fetch API:
const controller = new AbortController(); const signal = controller.signal; fetch('https://api.example.com/data', { signal }) .then(response => { if (!response.ok) { throw new Error(`Erro: ${response.status}`); } return response.json(); }) .then(data => { console.log(data); }) .catch(error => { console.log(`Houve um problema na requisição: ${error.message}`); }); // Cancela o request controller.abort();
No exemplo acima, criamos um objeto AbortController e armazenamos sua referência em uma variável chamada controller
.
Em seguida, passamos o signal
do objeto AbortController como uma opção para a chamada fetch()
.
Quando chamamos o método controller.abort()
, ele cancela a requisição que está sendo executada.
É importante notar que, uma vez que uma requisição foi cancelada, o Fetch API lançará uma exceção chamada AbortError
.
Você pode capturar essa exceção e lidar com ela de acordo com suas necessidades, como no exemplo acima.
Em resumo, o cancelamento de requisições com o Fetch API é uma tarefa um pouco complexa, mas é possível com o uso do objeto AbortController.
Ao usar o AbortController, você pode cancelar requisições HTTP com o Fetch API antes que elas sejam concluídas.
Quer aprender mais sobre React? Confira o vídeo abaixo:
Conclusão
Em conclusão, o cancelamento de requisições HTTP com o Fetch API pode ser uma tarefa importante em aplicações web.
Usando o objeto AbortController, é possível cancelar uma requisição antes que ela seja concluída e lidar com a exceção AbortError
de acordo com suas necessidades.
Este artigo espera ter fornecido uma compreensão clara e detalhada sobre como cancelar um request HTTP com fetch, e como o objeto AbortController pode ser usado para esse propósito.
Em resumo, o cancelamento de requisições HTTP com o Fetch API é possível e pode ser realizado usando o objeto AbortController.
Está buscando a sua primeira vaga como Programador? Confira o nosso treinamento completo clicando aqui.
Nosso principal objetivo é tornar você um dev no menor tempo possível, através de uma metodologia planejada nos mínimos detalhes, após formar muitos outros desenvolvedores.
Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!