fetch() rechaza con un TypeError cuando un fallo a nivel de red impide que la solicitud se complete. Esto es diferente de un estado de error HTTP (4xx/5xx): un error de red significa que no se recibió ninguna respuesta. Las causas comunes incluyen el servidor caído, fallo de resolución DNS o un rechazo de preflight CORS.
Por qué ocurre
- •El servidor no está en ejecución o la URL es inalcanzable.
- •Una solicitud preflight CORS (OPTIONS) fue rechazada antes de la solicitud principal.
- •El navegador está sin conexión o la conexión de red se cayó.
- •Un esquema de URL o nombre de host inválido hace que la resolución DNS falle.
Ejemplos
Código que causa el error
const data = await fetch("https://localhost:9999/api");
const json = await data.json();Error en la terminal
TypeError: Failed to fetch
Cómo solucionarlo
Distingue los errores de red (TypeError) de los errores HTTP (estado no ok). Verifica la URL y asegúrate de que el servidor esté en ejecución. Maneja ambos tipos de error explícitamente. Usa navigator.onLine para proporcionar retroalimentación de UI con conciencia de estado offline.
Código corregido
try {
const res = await fetch("https://api.example.com/data");
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const json = await res.json();
} catch (err) {
if (err instanceof TypeError) {
console.error("Network error:", err.message);
} else {
console.error("API error:", err.message);
}
}Errores relacionados
¿Listo para practicar tu inglés en el trabajo?
Lingua-e tiene ejercicios interactivos basados en conversaciones reales de developers: standups, code reviews, retrospectivas y más. Practica hasta que salga solo.
Prueba Lingua-e gratis