Saltar al contenido

¿Cómo puedo manejar el error 404 en async / await fetch API?

Solución:

Solo examina el status propiedad de la promesa resuelta antes de intentar extraer el cuerpo con el .json() método.

async function test() {
  const api_call = await fetch(`https://cors-anywhere.herokuapp.com/http://example.com/fake/fake`);
  console.log(api_call.status);
}

test();

Independientemente del uso async/await o prometer encadenamiento, el fetch API devuelve un promise que contiene un Response objeto. El objeto de respuesta contiene un status propiedad que devuelve un código de estado HTTP. Antes de llamar al .json() método en tu response objeto que puede comprobar para ver if res.status === 200. Por ejemplo, la API de OpenWeather devolverá un código de estado HTTP de 200 para solicitudes exitosas. Entonces, para verificar si su solicitud de API fue exitosa, puede hacer lo siguiente …

class App extends React.Component{
  getWeather = async (e) => {
    e.preventDefault();

    const city = e.target.elements.city.value;
    const country = e.target.elements.country.value;

    const api_call = await fetch(`http://api.openweathermap.org/data/2.5/weather?q=${city},${country}&appid=${API_KEY}&units=metric`);

    if (api_call.status !== 200) {
        // You can do your error handling here
    } else {
        // Call the .json() method on your response to get your JSON data
        const data = await api_call.json();
    }
  }

Puedes ver más de Response propiedades y métodos del objeto Al ver la documentación de MDN

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *