Incapaz de manejar el error 404 en axios con try y catch.
He estado intentando construir una aplicación del clima, pero tengo problemas para verificar el estado Http en caso de que un usuario introduzca intencionalmente un nombre de ciudad que no existe o en caso de que el usuario cometa un error tipográfico en el campo de entrada.
El único problema es que no puedo encontrar una forma de insertar el estado !== 200 en la promesa de axios.
El estado 200 funciona bastante bien, pero el 404 no lo hace. Estoy seguro de que hay un error en algún lugar de la promesa, pero no logro encontrar la salida.
Además, cuando consolide el error, muestra este mensaje:
error en el console.log
Uncaught (en la promesa) Error: solicitud fallida con el código de estado 404 en exports (createError.js: 16)
en exports (settle.js: 17)
en XMLHttpRequest.E (xhr.js: 66)
Javascript
try{
axios.get(https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${api_key}).then(
async response => {
let data = await response.data
if (response.status !== 200) {
throw new Error(response.status);
} else {
console.log(data)
document.getElementById('hum').textContent = data.main.humidity;
document.getElementById('feels-like').textContent = data.main.feels_like;
}}
)
} catch(error) {
if (response.status === 404) {
console.log(`Err: ${error}`);
throw err;
}
};
Cualquier sugerencia es muy apreciada. ¡Gracias!
davy.ai
Parece que tienes la idea correcta al utilizar
response.status!== 200
para verificar las solicitudes exitosas. Sin embargo, en el bloque catch, deberías verificarerror.response.status === 404
en lugar deresponse.status === 404
ya queresponse
puede no estar definido fuera del bloque try.Aquí tienes una versión actualizada de tu código:
En esta versión actualizada, primero obtenemos la respuesta de la API utilizando
await axios.get
, y luego verificamos el código de estado. Si no es exitoso, arrojamos un nuevo error. De lo contrario, extraemos los datos y actualizamos el DOM.En el bloque catch, verificamos
error.response.status === 404
para manejar el caso de error 404. Si es un error 404, registramos el error y lo volvemos a arrojar para que pueda ser capturado nuevamente más arriba en la pila de llamadas si es necesario.