XHR in javascript for Python displays three times the return

Asked

Viewed 82 times

0

I recently deployed Python to my IIS server, and started testing some requests. First I created the javascript code, as you can see below:

    sendRequest = function() {
        var http = new XMLHttpRequest();
        http.onreadystatechange = function() {
            if (this.readyState = 4 && this.status == 200) {
                console.log("ok!");
                var response = this.responseText;
                console.log(response);
            }
        };
        http.open("GET", "test.py", true);
        http.send();
        console.log("called");
    }  

The test.py file has the following code:

 print('Content-Type: text/plain')
 print('')
 print('Hello!')
 print('Hi')

However, the output I get on the console is:
okay!
(nothingness)
okay!
Hello!
Hi
okay!
Hello!
Hi

As far as I have tested, the sendRequest function is only executed once, what’s more, I found that the function onReadyStateChange is executed three times, why?

Could someone tell me why this happens? Any help is appreciated.

  • Could be the moment you call sendRequest, I believe it is no problem either in Ajax or Python. Post the code so that we can reproduce, which executes the sendRequest? It’s an onclick?

  • @Guilhermenascimento no, is through the console of Chrome. Besides, I put warnings to show how many times the snippet was repeated, so it seems to me that the onReadyStateChange function is called 3 times

  • With no, the console repeats itself because there is more than one call, the console is only a debug, the onReadyStateChange function is called 3 times because probably the event is being called 3 times sendRequest

  • @Guilhermenascimento then, do you think it’s something with the python script? I’ve never seen an XHR that I tested change status 3 times. I will try to track the requests on the console

2 answers

2


Maybe the problem is your if it’s wrong:

if (this.readyState = 4

When the right thing should be:

if (this.readyState == 4

Thus:

sendRequest = function() {
    var http = new XMLHttpRequest();
    http.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            console.log("ok!");
            var response = this.responseText;
            console.log(response);
        }
    };

    http.open("GET", "test.py", true);
    http.send();
    console.log("called");
};
  • God damn my distraction, thank you

2

I believe the problem is in your if

if (this.readyState = 4 && this.status == 200) {

You are assigning 4 to this.readyState and checking the connection status with 200.

How the connection state changes during the request, the event readyStateChange will be called 4 times, in only 3 of those the status is 200, so it runs the 3 times

Do so:

sendRequest = function() {
    var http = new XMLHttpRequest();
    http.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            console.log("ok!");
            var response = this.responseText;
            console.log(response);
        }
    };
    http.open("GET", "test.py", true);
    http.send();
    console.log("called");
}  

Browser other questions tagged

You are not signed in. Login or sign up in order to post.