How can i catch a server error with async await in javascript?

Question

So i have a function that fetches data from my API. I set a limit to the requests and when the limit is reached, the server returns a 500 response. When testing in local development, the error is catched and the showLimitReachedAlert function for a popup is triggered. When running the setup with docker (+ nginx) the popup function is not triggered.

How can i modify this function to catch 500 response and trigger the function?

function searchByKeyword() {
  for (let x in networks) {
    let urlParameter = x;
    let network = networks[x];

    async function SearchKeywordForNetwork() {
      let url = `${base}/articles/${urlParameter}/${startDate.value}/${endDate.value}/${searchKeyword.value}`;
      const response = await fetch(url);
      const json = await response.json();
      network.value = json;
    }

    SearchKeywordForNetwork().catch(showLimitReachedAlert);
  }
}

Answer 1

Figured out how to do this. Tested both in the Docker and local version.

function getMostRecentNews() {
  for (let x in networks) {
    let urlParameter = x;
    let network = networks[x];

    async function getToday() {
      let url = `${base}/articles/${urlParameter}`;

      fetch(url)
        .then(async (response) => {
          const json = await response.json();
          network.value = json;

          // check for error response
          if (!response.ok) {
            // const error = (json && json.message) || json.statusText;
            return Promise.reject(error);
          }
        })
        .catch((error) => {
          showLimitReachedAlert();
        });
    }

    getToday();
  }
}