send data to a python cgi script for processing from browser using pure javascript

Question

I have an html test file with the following

<!doctype html>
<html lang="en">
    <meta charset="utf-8">
    <body>
        <script type="text/javascript">
        var httprequest=new XMLHttpRequest();
        httprequest.open("POST","hello.cgi",true);
        httprequest.onload=function(){
        if(httprequest.status==200){
            alert("");
         }// end of if
         }//end of onload
         var content={"hello":"world"};
         httprequest.send(JSON.stringify(content));
         alert(httprequest.responseText)
          </script
    </body>
</html>
</doctype>

In this scenario I am trying to send the data {"hello":"world"}; to a python cgi script

This is my python script that works well with data submitted from a <form> html tag

#!/usr/bin/python
try:
    import sys
    import cgi
    import traceback
    print("Content-type: text/html\n\n")
    print "<h1>YES</h1>"
    formData = cgi.FieldStorage()
    print(formData)
    print(s)
except Exception as e:
    print(e.message)
    print(traceback.print_exc())

When I send the data {"hello":"world"}, my browser alert box shows no data returned from the cgi script.

As reflected in the cgi script, I am trying to print "YES" and print the data that was sent from javascript.

I have found several questions relating to use of $.ajax to do this but haven't come across a method using XMLHttpRequest()

Question

How can I send data to a python cgi script for processing from my browser using pure javascript (no jquery)

Your alert() happens long before the HTTP request has completed. It's an asynchronous operation. — Pointy
– Pointy, Commented Nov 25, 2015 at 2:57
okay..let me try this and see how this works...I am relatively new to JS — repzero
– repzero, Commented Nov 25, 2015 at 2:58
@Pointy..I moved "alert(httprequest.responseText)" and placed it inside the onload function and this works..can you post an answer and elaborate a little on the asynchronous operations relating to the above codes..Much appreciated.....I am not sure I grasp the reason why it doesn't work outside the function — repzero
– repzero, Commented Nov 25, 2015 at 3:14
OK give me a sec - this is a question which is asked (with many variations) very often, because the way things work is confusing — Pointy
– Pointy, Commented Nov 25, 2015 at 3:16

Pointy · Accepted Answer · 2015-11-25 03:18:45Z

1

The HTTP request you're performing happens on its own time. The call to httprequest.send() starts the operation, but that function call returns almost immediately, and definitely before the remote server has responded. This asynchronous behavior is a basic fact of life in JavaScript environments.

The whole reason for the "onload" callback is to make it possible for you to write code that happens when the HTTP request actually completes. The browser will invoke that function with the results when the results become available. That might be in 100 milliseconds, or 10 seconds; it all depends on the server and the network.

answered Nov 25, 2015 at 3:18

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

3 Comments

repzero Over a year ago

I see...this is very helpful especially the emphasized parts of the answer....:D

repzero Over a year ago

one more question..my output prints but the page shows that it is continously loading....any suggestions?

Pointy Over a year ago

@repzero the loading indicator can be hard to control; I don't know all the ways it can be "confused". It could be that there's some unrelated resource that it's waiting for. The "Network" browser debugging tab might help you figure that out.

Collectives™ on Stack Overflow

send data to a python cgi script for processing from browser using pure javascript

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related