How do I call a function(with javascript) after getting a response from nodeJs server?

Question

        const response = await fetch('/sign-up', options);
        const responseJson = await response.json().then(function(){


        })
            const status = responseJson.status;

            if(status == 'created'){
                alert('Account has successfully created')
            }else if(status == 'exist'){
                if(responseJson.Username){
                    $("#Username").css('box-shadow', 'inset 0 0 0 1px #DE071C');
                    $("#Username").css('background-color', '#EEEFF1');
                    $("#Username_error").css('display', 'block');
                    document.getElementById('text_Username_error').innerHTML = "This ID already exists. Please choose a different ID"
                }

                if(responseJson.Email){
                    $("#Email").css('box-shadow', 'inset 0 0 0 1px #DE071C');
                    $("#Email").css('background-color', '#EEEFF1');
                    $("#Email_error").css('display', 'block');
                    document.getElementById('text_Email_error').innerHTML = "This email already exists. Please choose a different email"

                }
            }else if(status == 'error'){
                $("#error").css('display', 'block');
            }

I'm sending a request with 'post' method by using a fetch(), and the server will response by sending a json file to the client. I've checked the json file with console.log(responseJson) and it works just fine. Client receives the json file perfectly, but the if statement after receiving doesn't work. responseJson.Username or responseJson.Email is not the problem, because console.log shows the output perfectly. I think if statement ends before receiving data, but I can't figure out how to solve this. poor me....

Does this answer your question? [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — jonrsharpe, May 20 '20 at 07:48
You're already calling a function after getting a response, the callback to .then, it's just that the function is completely empty, so you're awaiting for undefined. — jonrsharpe, May 20 '20 at 07:48

score 1 · Answer 1 · answered May 20 '20 at 07:51

1

i think that if you use the await keyword, you don't need to append the .then function. Try something like this

const responseJson = await response.json()
//call your function here

answered May 20 '20 at 07:51

Davide

11
2

score 0 · Answer 2 · answered May 20 '20 at 08:04

Specifically there are 2 ways to go about this issue, however, I would like to point out that you should not mix async await syntax with callback.

My suggested method based on your current code:

let response = await fetch('/sign-up', options);
response = await response.json();
if (response.status === 'created') {
  ...
} else if (response.status === 'exist') {
  ...
  if (response.Username) {
    ..
  }
}
...

I greatly encourage looking into object de-structuring as well if you have the time, as it will reduce the repetition of a certain attribute, in which the syntax can be changed to:

const response = await fetch('/sign-up', options);
const { status, Username, Email } = await response.json();
if (status === 'created') {
  ...
} else if (status === 'exist') {
  ...
  if (Username) {
    ..
  }
}
...

How do I call a function(with javascript) after getting a response from nodeJs server?

2 Answers2