REST API Error Handling

Hi retool team - trying to figure out the best way to do error handling when using a REST API. The API I'm using is pretty simple and has an error response similar to Stripe.

If there is an error, the REST API will return a 400 and have an HTTP response body that looks like:

{
    "error": {
        "kind": "validation_error",
        "message": "Form cannot be Completed without an Index"
    }
}

If the query throws an error, I'd like to just return only the message to the user. I've tried enabling the Error Transformer and selecting the message (see image below).

This seems to actually work as when I preview the result in the query, it shows:

message: "Error transformer produced: Form cannot be Completed without an Index" - which is correct, however, when I actually run the query as part of the app function, the entire JSON response body is being shown, which is what I'm trying to avoid (see below).

Query Error (updateStatus): {"error":{"kind":"validation_error","message":"Form cannot be Completed without an Index"}}

Am I missing something to plug this error transformer into the actual query error or something?

Thanks!

Dan

1 Like

Hey @gilcrest!

Thanks for reporting this, I see the same behavior on my end! I’m writing up a ticket to our engineering team to get this looked at. I couldn’t think of any workarounds other than displaying the message within a text component, but I wouldn’t recommend it as it’ll introduce unnecessary complexity.

I’ll update this thread once we have an update!

1 Like

Thanks! One other question I have while we're at it :slightly_smiling_face:
If my API returns a 200 (OK), the Error transformer still seems to be executing? It seems like it executes no matter what is returned. In my case, the response body for a 200 is very different than the 400 error response and this is the error message I'm now receiving even though my API is responding successfully...

My assumption was that an Error Transformer would be something that is used to transform an error response only, but it appears that it is something that needs to handle whatever response may be sent (which I can understand after reading the Error transformer use cases you have for GraphQL). Is there an easy way to only fire this conditionally based on an HTTP 400 error? Or maybe I shouldn't even be using an error transformer and should be using something else?

Thanks again!

Dan

Similar issue here but for me the notification always displays Query Error (QUERY_NAME_HERE): Query run error and nothing regarding my passed in message. Tested even with a simple return "error" but it displayed what was previously stated.

1 Like

I’m getting the same issue on my Retool pages. Whatever the API is responding, the Error Transformer doesn’t display the error property of my respond object… Any news on that?

Thanks.

1 Like

Not sure if something changed but my errors now show up as expected!

1 Like

Hey y'all! Good news — the bug has now been fixed! Rest error transformers will now return correct error messages :confetti_ball: Thank you to everyone for your feedback and patience here!

(And @mgmolisani-gamercraft thank you for being so quick to chime in, truly awesome to see :blush:)

My team is pretty happy they no longer have to follow my directions to open the console to see where I was temporarily logging the errors for them until this was resolved. The good news was it just started working no changes required.

So happy to hear it's working, and so sorry to put you and your team through that. :sweat_smile:

This is great - I'm going to have to test it out ASAP (I had removed it). I wanted to ask a question about the intent of the error transformer. The tooltip for the transformer says the following:

Screen Shot 2020-10-23 at 8.26.13 PM

I didn't read this carefully initially. Are error transformers really only for successful (200) query returns as it says in this tooltip? I'm trying to determine the best way to handle a 400 error that returns a different response body than if the query is successful.

Sorry to bug, but I'm still a bit confused - I'm gonna try it out now though!

Thanks!

Hi @victoria! Sorry it’s been a minute since I responded here and I was hoping you could help me. I have tested the error transformer behavior and it functions as it is written in the tooltip, but that doesn’t really help solve my problem. The error transformer does seem to only execute when the API responds with a 200, which makes sense for certain use cases.

The use case that I described originally back on July 22 is when an API returns a proper HTTP error response status code (a 400+ error) and has a JSON object in the response body, similar to the below.

{
    "error": {
        "kind": "validation_error",
        "message": "Form cannot be Completed without an Index"
    }
}

Right now, when my API responds with a 400 and an error like this, the whole giant string is returned, which is pretty illegible to my users. I need to pull out just the message from the response body and just display that in the error popup.

Is that possible? I think this is a fairly routine use case and maybe I’m just missing something simple?

Thanks so much for your help!

Best,

Dan

Hey @gilcrest, I’ll be working on this over the coming weeks! Just to confirm, is the ideal scenario for you to just display “Form cannot be Completed without an Index” to your users in the little toast that pops up?

Is there any other functionality around this that you’d like? Happy to hop on a call if that’s helpful or you can also reply in this thread.

1 Like

Hey @yogi!

You got it exactly. Ideally, I'd like for retool to anticipate that the response body can often be different when an API returns with an error status code (400+). I'd like to be able to access the elements of this response body and be able to choose elements to be added to the error toast. The specific use case I'm trying to solve has an error message structure that is exactly like the example I gave.

I'm happy to setup a dummy API that we can test with that can return a success or failure based on some simple flag if it's helpful!

Let me know. Thanks a lot for your help!

Best,

Dan

@gilcrest, we recently pushed out a feature to address called "Failure conditions." Basically we let you on certain conditions either:

  1. Mark a successful query as a failure (like error transformers)
  2. OR convert the error message of an already failing query. (your use case)

This feature is currently behind a feature flag, so you'll have to go to https://yourOrgName.retool.com/settings/beta to enable it. It's the "Mark queries as failed" option. (Once you set turn this flag on, you have to refresh your app editor page and you'll see a new tab in the bottom Query Editor).

I'd love if you tried it and let us know if this works for you!

2 Likes

Hi @yogi - thanks so much! I’m very sorry it took me so long to respond, was gearing up for Thanksgiving… I’m going to try this out in the next few days for sure. I’ll let you know what I find.

Thanks again!

Dan

1 Like

Hi again @yogi - unfortunately, I am not currently seeing this option under Beta. I am only seeing Approval Workflows and Shell Scripting

Best,

Dan

@gilcrest we shipped it to prod, so it should just be live by default now :slight_smile: docs here: https://docs.retool.com/docs/transformers#failure-conditions

Well now, isn’t this exciting!? Thanks @justin and @yogi! I’m going to check it out right now…

Hi @justin and @yogi - I was able to do some testing just now. When my APIs are failing with a 400 error, the Failure condition does not seem to have access to the data.statusCode value. I am using the exact same logic as you have in your example as my API is returning a 400. I have the logic as follows {{ data.statusCode === 400 }}

I can see this is always returning false even though, in the Left Panel, I am able to see that the statusCode is indeed 400

Screen Shot 2020-11-30 at 1.10.52 PM

The good news is that if I always set the Failure Condition to true with {{ true }} it does seem to be properly parsing my error response as the message is getting pulled from the error JSON with {{ data.error.message }} Obviously, setting to always be true is silly, but I just wanted to investigate whether I was able to get to my error message or not and I am this way and the toast looks great!

Though, TBH, the data structure seems strange to me - shouldn't I actually be pulling data.message.error.message given the data structure in the Left panel? It seems a bit off to me...

@gilcrest, thanks for the feedback! I’ll look into why you can’t see statusCode

In the meantime, could you try {{ error }} in the left hand side? Curious if that works for you