catch fetch ERR_CONNECTION_REFUSED

Question

I must be getting old google searches because I can't find any threads on how to do this if you are using javascript's fetch not the old XMLHttpRequest

I am trying to test whether or not my VM is online. The rest of the VM is locked down but I left an open endpoint for testing.

I tried using the status to check if the server is up but gave me a different error than a response error:

fetch("https://rockosmodernserver.westus2.cloudapp.azure.com/ ", {
            method: "GET",
            }).then(response => response)
            .then(data => {
                if (data.status == 200){
                    console.log("server is up")
                }
                else{
                 console.log("server is down!!")   
                }
            })

It works if the server is up but if the server is down I get:

VM739:1 GET https://rockosmodernserver.westus2.cloudapp.azure.com/ net::ERR_CONNECTION_REFUSED

when I tried googling this I got solutions for XMLHttpRequest but not for the fetch module.

Why would you expect a server that's offline to return a status code? — Daniel Beck, Mar 30 '22 at 17:17
@Barmar, Isn't fetch catch unable to catch 4xx or 5xx error? I think fetch will consider 404 as a suceessful call and without access the response, we could only know when there are network/sever not responding error??? (is I am wrong?) — James, Mar 30 '22 at 17:24

BadPiggie · Answer 1 · 2022-03-30T17:28:01.063

2

If the server doesn't respond, fetch takes it as connection failure and handles it in the catch() block. The fetch only executes then() blocks when the connection is successful. If the connection was not successful, the catch() block will be executed.

fetch('something')
 .then( response => {})
 .catch(error => {
   // handle error here
 })

Checking that fetch was successful

edited Mar 30 '22 at 17:28

answered Mar 30 '22 at 17:19

BadPiggie

5,471
1
14
28

@Barmar Yes. My Bad. Thanks for pointing it – BadPiggie Mar 30 '22 at 17:22

score 2 · Accepted Answer · answered Mar 30 '22 at 17:22

You looking for catch block. In the catch block you can fetch the errors. Imn the example below you have access to the error object.

fetch("https://rockosmodernserver.westus2.cloudapp.azure.com/ ", {
    method: "GET",
    }).then(response => response)
    .then(data => {
        console.log("server is up")
    })
    .catch((error) => {
      console.error('Error:', error);
      console.log("server is down!!")   
    });

Magraina · Answer 3 · 2022-03-30T17:40:02.870

If a server is not answering, he can not give you a response. Which means there is no status code.

Update: A fetch() promise will reject with a TypeError when a network error is encountered or CORS is misconfigured on the server-side, although this usually means permission issues or similar — a 404 does not constitute a network error, for example. An accurate check for a successful fetch() would include checking that the promise resolved, then checking that the Response.ok property has a value of true. The code would look something like this:

  fetch('flowers.jpg')
  .then(response => {
    if (!response.ok) {
      throw new Error('Network response was not OK');
    }
    return response.blob();
  })
  .then(myBlob => {
    myImage.src = URL.createObjectURL(myBlob);
  })
  .catch(error => {
    console.error('There has been a problem with your fetch operation:', error);
  });

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#checking_that_the_fetch_was_successful

First edit: This solution could be helpful, by using a timeout and track that timeout has happened. https://stackoverflow.com/a/50101022/13111978

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). — Community, Mar 30 '22 at 17:26

catch fetch ERR_CONNECTION_REFUSED

3 Answers3