¿Cómo detectar y manejar la respuesta de error 422 con Redux / Axios?

Solución:

Ejemplo

getUserList() {
    return axios.get('/users')
      .then(response => response.data)
      .catch(error => {
        if (error.response) {
          console.log(error.response);
        }
      });
  }

Verifique la respuesta del objeto de error, incluirá el objeto que está buscando para que pueda hacerlo error.response.status

https://github.com/mzabriskie/axios#handling-errors

Probablemente Axios esté analizando la respuesta. Accedo al error así en mi código:

axios({
  method: 'post',
  responseType: 'json',
  url: `${SERVER_URL}/token`,
  data: {
    idToken,
    userEmail
  }
})
 .then(response => {
   dispatch(something(response));
 })
 .catch(error => {
   dispatch({ type: AUTH_FAILED });
   dispatch({ type: ERROR, payload: error.data.error.message });
 });

De los documentos:

La respuesta a una solicitud contiene la siguiente información.

{
  // `data` is the response that was provided by the server
  data: {},

  // `status` is the HTTP status code from the server response
  status: 200,

  // `statusText` is the HTTP status message from the server response
  statusText: 'OK',

  // `headers` the headers that the server responded with
  headers: {},

  // `config` is the config that was provided to `axios` for the request
  config: {}
}

Entonces el catch(error => ) es en realidad solo catch(response => )

EDITAR:

Todavía no entiendo por qué registrar el error devuelve ese mensaje de pila. Intenté registrarlo así. Y luego puedes ver que es un objeto.

console.log('errorType', typeof error);
console.log('error', Object.assign({}, error));

EDIT2:

Después de mirar un poco más, esto es lo que está intentando imprimir. Que es un objeto de error de Javascipt. Axios luego mejora este error con la configuración, el código y la respuesta de esta manera.

console.log('error', error);
console.log('errorType', typeof error);
console.log('error', Object.assign({}, error));
console.log('getOwnPropertyNames', Object.getOwnPropertyNames(error));
console.log('stackProperty', Object.getOwnPropertyDescriptor(error, 'stack'));
console.log('messageProperty', Object.getOwnPropertyDescriptor(error, 'message'));
console.log('stackEnumerable', error.propertyIsEnumerable('stack'));
console.log('messageEnumerable', error.propertyIsEnumerable('message'));

Aquí está la forma correcta de manejar el error objeto:

axios.put(this.apiBaseEndpoint + "https://foroayuda.es/" + id, input)
.then((response) => {
    // Success
})
.catch((error) => {
    // Error
    if (error.response) {
        // The request was made and the server responded with a status code
        // that falls out of the range of 2xx
        // console.log(error.response.data);
        // console.log(error.response.status);
        // console.log(error.response.headers);
    } else if (error.request) {
        // The request was made but no response was received
        // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
        // http.ClientRequest in node.js
        console.log(error.request);
    } else {
        // Something happened in setting up the request that triggered an Error
        console.log('Error', error.message);
    }
    console.log(error.config);
});

URL de origen https://gist.github.com/fgilio/230ccd514e9381fafa51608fcf137253

---

---

Utiliza Nuestro Buscador