Axios

O que é Axios?

Axios é um cliente HTTP popular baseado em Promise para navegador e Node.js, escrito em TypeScript. Ele fornece uma interface conveniente e poderosa para realizar requisições HTTP, suporta interceptadores (interceptors), transformação automática de dados JSON e proteção contra CSRF. A biblioteca é ideal para aplicações web modernas que exigem trabalho flexível com REST API.

Para que serve Axios?

Diferente do fetch nativo, Axios faz o parse automático de JSON, trata erros de status HTTP (como 404 ou 500) como exceções, suporta cancelamento de requisições e barras de progresso de upload. Para projetos TypeScript, Axios fornece tipagem estrita para respostas e requisições, simplificando o desenvolvimento e reduzindo a quantidade de bugs. Se você escreve em TypeScript e trabalha com API, Axios é a escolha padrão.

Instalação

npm install axios

Para projetos em TypeScript, os tipos já estão incluídos no pacote, não sendo necessário instalar @types/axios adicionalmente.

Funcionalidades principais

• Suporte a todos os métodos HTTP: GET, POST, PUT, DELETE, PATCH e outros.
• Transformação automática de dados: respostas são automaticamente convertidas para JSON e objetos de requisição são serializados.
• Interceptadores (interceptors): é possível adicionar lógica antes do envio da requisição ou após receber a resposta (por exemplo, para adicionar um token de autorização).
• Cancelamento de requisições: através de CancelToken ou AbortController.
• Timeouts e progresso: configuração de tempo de espera e monitoramento do progresso de upload/download.
• Tipagem estrita: suporte a generics para tipagem do corpo da resposta.

Exemplo de código em TypeScript

import axios, { AxiosResponse } from 'axios';

interface User {  id: number;  name: string;  email: string;}

async function fetchUser(id: number): Promise<User> {  try {    const response: AxiosResponse<User> = await axios.get<User>(`https://api.example.com/users/${id}`);    return response.data;  } catch (error) {    if (axios.isAxiosError(error)) {      console.error('Erro Axios:', error.message);    } else {      console.error('Erro inesperado:', error);    }    throw error;  }}

// UsofetchUser(1).then(user => console.log(user.name));

Quando usar Axios

Axios é ideal para qualquer projeto em TypeScript que exija interação com servidores HTTP: desde SPA simples até aplicações server-side complexas em Node.js. É especialmente útil quando é necessário tratamento avançado de erros, serialização automática de dados ou trabalho com múltiplas APIs. Se você usa React, Vue ou Angular, Axios integra-se facilmente graças ao suporte a interceptadores e cancelamento de requisições.

A biblioteca é ativamente mantida, possui uma enorme comunidade e é utilizada em milhares de projetos. Axios é uma solução madura e estável que não requer dependências adicionais.