Execute asynchronously a sync function inside AJAX (Javascript)

Question

This is the sync function.I call it inside an Ajax, but how is synchronous it´s deprecated. ¿Is there any way to run it as if it were asynchronous? Or to make it asynchronous? Thanks.

function fetchHeader(url, hdr) {
  try {
    var req=new XMLHttpRequest();
    req.open("HEAD", url, false);
    req.send(null);
    if(req.status== 200){
    return req.getResponseHeader(hdr);
    }
    else return false;
} catch(er) {
    return er.message;
}

I've tried that, but it says: response is not defined and callback is not a function.

function fetchHeader(url, hdr, callback) {
 try {
  var req=new XMLHttpRequest();
  req.onreadystatechange = function() { 

    if(this.status == 200) {

      callback(req.getResponseHeader(hdr), req);
    }else{
        console.log("callback is not called");
    }
 }
 req.open("HEAD", url, true);
 req.send(null);

 } catch(er) {
  return er.message;
 }
 }

And I call it:

 fetchHeader(dirGen+json[i],'Last-Modified', function(header, request) {
 if (response.statusCode == 200) {
 return header;
 console.log(header);

 }else {
 console.log("Failed answer");
 }
 });

Well in the function you are passing you try to use response.statusCode but you do not have a response variable so that's why you get the error about response — Patrick Evans
– Patrick Evans, Commented Sep 7, 2017 at 15:27
Yes, it is. But response would not exist until the callback gets called. Why is not it called? — atralvarez
– atralvarez, Commented Sep 7, 2017 at 15:31
It would have to be called in order for you to get the error message response is not defined — Patrick Evans
– Patrick Evans, Commented Sep 7, 2017 at 16:18

skylize · Accepted Answer · 2017-09-07 16:25:54Z

1

You don't need to micromanage XMLHttpRequest anymore. Just listen for the 'load' event. Actually I suggest you switch to fetch. fetch returns a promise which will help you build cleaner code for this type of thing. But here is basics of how to call one XHR and then start another after you get a response.

var url1 = 'path/to/file'
var url2 = 'path/to/differentfile'

function onXhrError() {
  // ... handle errors
}

xhr1 = new XMLHttpRequest()

xhr1.addEventListener('load', onXhrLoad1)
xhr1.addEventListener('error', onXhrError)

xhr1.open('GET', url1)
xhr1.send()

function onXhrLoad1 (){
  var res = this.responeText

  function onXhrLoad2 (){
    var res2 = this.responeText
    // ... do stuff with second response
  }

  var xhr2 = new XMLHttpRequest()
  xhr1.addEventListener('error', onXhrError)
  xhr2.addEventListener('load', onXhrLoad2)
  xhr2.open('GET', url2)
  xhr2.open()

  // ... do other stuff with first resoponse
}

answered Sep 7, 2017 at 16:25

skylize

1,4511 gold badge11 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

atralvarez Over a year ago

I gonna try it. Thanks for the answer!!

Collectives™ on Stack Overflow

Execute asynchronously a sync function inside AJAX (Javascript)

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related