Run python script by clicking button in javascript

Question

What I want is run python script just click on the button in the html page and show the python code result on my page.

Because it's just a small project, so I don't want to be overkill learning Django or other web frames even though I know it will work.

I made some searches, ajax seems the right solution for me, but I don't know how to execute python code by ajax. I know I can get some string back via ajax using following code:

function loadXMLDoc()
{
    var xmlhttp;
    xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function()
    {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","test1.txt",true);
    xmlhttp.send();
}

Thanks in advance for anyone who can help.

The way people do this is that they usually have their own server sitting somewhere that's designed to respond with the results of the script. They make an AJAX call to the server at the URL the server is listening at, and then get back the results. I don't think you have a server set up, and without it this task is impossible. If you do have a server set up, make it respond to GET requests by running the script and responding with the results. A very simple framework to do this is Flask. — Akshat Mahajan
– Akshat Mahajan, Commented Mar 27, 2016 at 21:58
Thanks for your kind reply! I'm actually not sure about the server you talked about, the only server I had is MAMP in mac, or I can run a python server at port 8080. I don't know if it works as you said :) — nickyzhi
– nickyzhi, Commented Mar 28, 2016 at 4:31

subdavis · Accepted Answer · 2016-03-27 22:43:32Z

1

To extend @Liongold's comment, The full workflow goes like this:

Overview of how this happens

The javascript code for a button click gets executed. This code is running on the client from a browser.
The AJAX request gets sent over the internet just like an HTTP request, which is interpreted by a web application running on the computer that will run the Python code.
The python code creates a response, and formats it for sending back to the client.
The javascript reads the response as plain text, and decides what it means and how to use it. JSON is a very popular format for exchanging data via AJAX

What you need to do

Either:

Learn a server-side python framework. Flask is lightweight and will probably do what you want. The largest obstacle I've found here is dealing with Cross-origin (CORS) problems. Get started at http://flask.pocoo.org/docs/0.10/quickstart/

OR

See if you can port the python script INTO the browser. Does the code need to be run on a specific computer ( the server ) or could it theoretically be converted into javascript and run within the webpage. If the language difference is your only problem, have a look at http://www.skulpt.org/

answered Mar 27, 2016 at 22:43

subdavis

7337 silver badges22 bronze badges

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

2 Comments

nickyzhi Over a year ago

Thanks so much! skulpt is really interesting, but I doubt if it works for me. You inspired me I can try to convert python code to javascript, hope I can do it.

nickyzhi Over a year ago

Sadly I can't just transfer the language. I'll try flask.

Mr P. · Accepted Answer · 2016-11-28 17:20:08Z

I ran into a similar problem, and after searching for several hours, this is how i solved it. Assuming that the html file and the python file are the same folder.

<script>
function runScript() {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function() {
        if (request.readyState === 4) {
            if (request.status === 200) {
                alert('Successful .... ' + request.responseText);
            } else {
                alert('Something went wrong, status was ' + request.status);
            }
        }
    };
    request.open('POST', 'test.py', true);
    request.send(null);
    return false;  
};

document.getElementById('script-button').onclick = runScript;
</script>

This goes to your html file
-----------------------------
<button type="button" id="script-button">
  
  add this line at the top of your python file
  ---------------------------------------------
  
  test.py
  ------------
  
  #!C:\Python34\python.exe -u
  print("Testing 123")
  
  add this directive to httpd.conf (Apache)
  -----------------------------------------
  
  # "C:/xampp/cgi-bin" should be changed to whatever your ScriptAliased
# CGI directory exists, if you have that configured.
#
<Directory "C:/xampp/<path to your project on the web server>">
    AllowOverride All
    Options Indexes FollowSymLinks Includes ExecCGI
    AddHandler cgi-script .py .pyc
    Order allow,deny
    Allow from all
    Require all granted
</Directory>

Thanks for the comment, I finally chose to use flask. it's pretty easy to learn and able to solve lots of code communication problems.

Collectives™ on Stack Overflow

Run python script by clicking button in javascript

2 Answers 2

Overview of how this happens

What you need to do

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Overview of how this happens

What you need to do

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related