Catch 504 (Gateway Timeout) Error in React, JavaScript

user_5131437 0
Viewed 10279

I have a working API to get items from the server as below. I am using React to use this data. Now, I want to catch all server errors that begins with 5__ and display a message like "No connection with internet" or something like that.

 export const GetItems = (operand, searchValue) => {
      const trimmedValue = searchValue.trim();
      let combinedResults;
      // make 2 API calls to search on both item_name and code;
      // then combine them;
      // there is no API method to do this, that I could find
      return getItemsByName(operand, trimmedValue)
      .then(result => (
        (combinedResults = [].concat(result))
      ))
      .then(() => getItemsByCode(operand, trimmedValue))
      .then(result => (
        (combinedResults = combinedResults.concat(result))
      ));
    };

Currently, I need to look at the console to check if there is a problem with connection.

504 Gateway Timeout Error

Updated as @Dane requested

const getItemsByCode = (operand, searchValue) => (
  FetchToJson(BuildCodeSearchUrl(operand, searchValue))
);

It's just calling a method to build the URL. You can consider that everything is working good, getting the response if there is a connection.

reactjs server error-handling javascript
1 Answers

Use catch():

return getItemsByName(operand, trimmedValue)
      .then(result => (
        (combinedResults = [].concat(result))
      ))
      .then(() => getItemsByCode(operand, trimmedValue))
      .then(result => (
        (combinedResults = combinedResults.concat(result))
      ))
      .catch((error) => {
        if (error.response) { // if there is response, it means its not a 50x, but 4xx

        } else {   // gets activated on 50x errors, since no response from server
          // do whatever you want here :)
        }            
      });
user_64734350
Related