react - ¿Cómo manejo los errores de recuperación de JavaScript?

fetch node js

Question

Si una llamada de fetch falla en Chrome, la única información de error que recibo es

TypeError: Error al obtener

¿Cómo muestro un mensaje de error informativo para el usuario final en este caso?

Específicamente:

¿Es posible obtener algún detalle sobre por qué falló la búsqueda?

Por ejemplo, si el servidor falla, Chrome DevTools podría registrar un mensaje de consola de net: ERR_EMPTY_RESPONSE, pero parece que no hay manera de acceder a esto desde JavaScript.

Por lo que puedo decir, la respuesta es no; Supongo que esto es por razones de seguridad, para evitar que JS malintencionado descubra qué sitios son o no accesibles mediante la inspección de los mensajes de error.

¿Es posible distinguir los errores de recuperación de otros TypeError s?

Si no puedo obtener los detalles del error, me gustaría al menos reemplazar el mensaje horriblemente vago "No se pudo recuperar" con un informativo "No se pudo acceder al sitio web; inténtelo de nuevo más tarde" y me gustaría hacerlo esto sin ningún riesgo de mostrar ese mensaje para otros TypeError s.

La única solución que he encontrado aquí es verificar el message real para ver si es "Failed to fetch" . Esto obviamente es específico del navegador; funciona en Chrome, parece que funcionará en cualquier idioma de usuario de Chrome, y otros navegadores necesitarán su propia prueba y manejo.

Answer 1

Parece probable que no haya más detalles para problemas de red / permiso / entrada.

¿Es posible distinguir los errores de recuperación de otros TypeErrors?

Sí, solo necesita catch los errores de la llamada de fetch :

fetch(…)
.catch(err => new FetchError(err))
.…
class FetchError extends Error {
constructor(orig) {
super();
this.message = "fetch error";
this.details = orig;
}
}