React-admin: Custom REST errors handling

Created on 9 Jul 2017 · 6Comments · Source: marmelab/react-admin

Hi,
Is it possible to add in future release a custom and simplified error handling within a custom rest client?

I read #180, but personally I think it's a very heavy task for such a simple requirement. Wouldn't be worth it to simplify custom errors handling ? I Think it's a common problem

enhancement

Source

dili91

👍4

Most helpful comment

I've the same need. Here's my finding:

default crudResponse.js will render message in HttpError object or 'aor.notification.http_error'

case CRUD_GET_LIST_FAILURE:
case CRUD_GET_MANY_FAILURE:
case CRUD_GET_MANY_REFERENCE_FAILURE:
case CRUD_CREATE_FAILURE:
case CRUD_UPDATE_FAILURE:
case CRUD_DELETE_FAILURE: {
    console.error(error);
    const errorMessage = typeof error === 'string'
        ? error
        : (error.message || 'aor.notification.http_error');
    return yield put(showNotification(errorMessage, 'warning'));
}

HttpError object is generated by fetchUtil.js

if (status < 200 || status >= 300) {
    return Promise.reject(new HttpError((json && json.message) || statusText, status));
}

we can catch and throw a different error if we implement our restClient

const { url, options } = convertRESTRequestToHTTP(type, resource, params);
return httpClient(url, options)
  .then(response =>
    convertHTTPResponseToREST(response, type, resource, params)
  )
  .catch(error => {
    // error is HttpError object
    console.log(error, error.message, error.status);
    return Promise.reject(error); // rethrow it
  });

However the body of my error response is { _erorr: "..." } so it is not assigned to HttpError.message.
HttpError only stores "Internal Server Error", 500, which is not particularly useful.
I call for passing json as 3rd parameter to HttpError so we can do custom remapping.

// fetchUtil.js
if (status < 200 || status >= 300) {
    return Promise.reject(new HttpError((json && json.message) || statusText, status, json || body));
}

// custom restClient
  .catch(error => {
    // error is HttpError object
    console.log(error, error.message, error.status, error.body);
    return Promise.reject({ message: error.body._error });
  });

@fzaninotto what do you think?

leesei on 15 Aug 2017

👍3

All 6 comments

I've the same need. Here's my finding:

default crudResponse.js will render message in HttpError object or 'aor.notification.http_error'

case CRUD_GET_LIST_FAILURE:
case CRUD_GET_MANY_FAILURE:
case CRUD_GET_MANY_REFERENCE_FAILURE:
case CRUD_CREATE_FAILURE:
case CRUD_UPDATE_FAILURE:
case CRUD_DELETE_FAILURE: {
    console.error(error);
    const errorMessage = typeof error === 'string'
        ? error
        : (error.message || 'aor.notification.http_error');
    return yield put(showNotification(errorMessage, 'warning'));
}

HttpError object is generated by fetchUtil.js

if (status < 200 || status >= 300) {
    return Promise.reject(new HttpError((json && json.message) || statusText, status));
}

we can catch and throw a different error if we implement our restClient

const { url, options } = convertRESTRequestToHTTP(type, resource, params);
return httpClient(url, options)
  .then(response =>
    convertHTTPResponseToREST(response, type, resource, params)
  )
  .catch(error => {
    // error is HttpError object
    console.log(error, error.message, error.status);
    return Promise.reject(error); // rethrow it
  });

// fetchUtil.js
if (status < 200 || status >= 300) {
    return Promise.reject(new HttpError((json && json.message) || statusText, status, json || body));
}

// custom restClient
  .catch(error => {
    // error is HttpError object
    console.log(error, error.message, error.status, error.body);
    return Promise.reject({ message: error.body._error });
  });

@fzaninotto what do you think?

leesei on 15 Aug 2017

👍3

There is no standard in REST land about passing error messages. I suggest you use your own fetch function instead of the one from fetchUtils in your case.