Wait for Server response in Javascript

Question

Wait for Server response in Javascript

Navigation

#1 by (2 votes)
#2 by (1 votes)

1

I want my <script> not to continue running until I get the server's response and do what it has to do, I'm using native browser Javascript, that is, without frameworks or libraries or anything.

<script>
        function run(){
             cargar() 
             sppWizard.init(optionsAssistant);
        } 
        </script>
    </head>
     <body class="spp-loading" onload="run()">

Here in the Head, I create the load () function; WHEN I have finished that function I want the next line to be executed.

function cargar() {

// realizamos proceso de validacion del JSON
var request = new XMLHttpRequest();
request.open("GET", "./entrada", true);
request.send(null);
request.onreadystatechange = function() {
    if (request.readyState === 4 && request.status === 200) {
        var MyJSON = JSON.parse(request.responseText);
        procesar(MyJSON);
    }
  }
}

In turn this function will call others and so, but when the Load () ends; is when the javascript code should follow, how do I do this?

At the moment the JSON of the server, I take it from the premises, in the future, a server will be called ...

Thank you.

javascript

asked by EduBw 05.11.2018 в 17:33

source

2 answers

2

What you want to do can be done with a callback , a callback ensures that certain code does not run until another fragment has finished its execution. The implementation is something like this:

function primera(callback) {
  // Simular un retraso en el código
  setTimeout(function () {
    console.log(1);
    callback();
  }, 500);
}
function segunda() {
  console.log(2);
}

primera(segunda);

For your example, it could be done like this. The cargar() function would be:

function cargar(callback) {

  // realizamos proceso de validacion del JSON
  var request = new XMLHttpRequest();
  request.open("GET", "./entrada", true);
  request.send(null);
  request.onreadystatechange = function () {
    if (request.readyState === 4 && request.status === 200) {
      var MyJSON = JSON.parse(request.responseText);
      procesar(MyJSON);
      callback();
    }
  }
}

And to call it would be something like this:

function run() {
  cargar(function () { 
    // Aqui va el código que quieres ejecutar cuando termine la función cargar()
    sppWizard.init(optionsAssistant);
  })

}

answered by 05.11.2018 в 17:44

Implement Http Headers in Ionic-Angular Project (Enable Cors in Api Rest) Execute script with InnerHtml without using eval ();

score 1 · Accepted Answer

Remember that AJAX its functionality is asynchronous, that is, the JS script will continue running regardless of whether or not you answered it. Here we can do two things in your upload function

if (request.readyState === 4 && request.status === 200) {
    var MyJSON = JSON.parse(request.responseText);
    sppWizard.init(optionsAssistant);
    procesar(MyJSON);
}

Launch your function sppWizard.init(optionsAssistant); When the server responds, or

request.open("GET", "./entrada", false);

Change the request to synchronous, that is, not continue with the script until the server responds.

To what you require, you would better to synchronous request because if you have more in your JS code you'll have to get to if the success of AJAX