Axios Instance
Este archivo define una instancia personalizada de Axios para gestionar las peticiones HTTP hacia la API de ProductTrack.
Centraliza la configuración de cabeceras, URL base e interceptores para el manejo automático de autenticación.
🔍 Ubicación
src/utils/axiosInstance.ts
📌 Propósito
- Establecer una URL base para todas las solicitudes.
- Definir cabeceras comunes como
Content-Type. - Añadir automáticamente el token JWT a las peticiones cuando esté disponible en
localStorage. - Evitar duplicación de configuración en cada solicitud HTTP.
🧩 Importaciones clave
| Módulo | Propósito |
|---|---|
axios | Cliente HTTP para realizar solicitudes a la API. |
url | Constante con la URL base de la API. |
🧰 Elementos principales
🔹 Creación de la instancia
Se utiliza axios.create() para definir:
baseURL: la URL raíz de la API, importada desde../constants.headers: configuración por defecto para enviar datos en formato JSON.
🔹 Interceptor de solicitudes
Antes de enviar cada petición:
- Obtiene el token de autenticación almacenado en
localStorage. - Si el token existe, añade el encabezado
Authorizationcon formatoBearer <token>. - Este proceso se realiza de forma automática, sin intervención manual en cada llamada.
🧠 Detalles técnicos
- Funciona tanto en entornos de desarrollo como de producción.
- Permite que cualquier módulo que lo importe haga peticiones autenticadas sin repetir lógica.
- El token solo se agrega si está presente en el almacenamiento local.
💡 Ejemplo de uso
import axiosInstance from '@/utils/axiosInstance';
async function getProductos() {
const { data } = await axiosInstance.get('/productos');
return data;
}
En este ejemplo:
- No es necesario incluir la URL completa de la API.
- El encabezado
Authorizationse agrega automáticamente si hay un token válido.
✅ Resumen
| Elemento | Propósito |
|---|---|
| Instancia Axios | Define configuración común para todas las solicitudes |
| Interceptor | Agrega token JWT automáticamente |
| URL base centralizada | Facilita el mantenimiento y evita errores repetidos |