Call python function from JS
Solution 1:
Apart from the mentioned points and assuming you already have a proper setup to serve your python script and return the response. You should submit an asynchronous request, especially if the python code does some heavy computation.
function postData(input) {
$.ajax({
type: "POST",
url: "/reverse_pca.py",
data: { param: input },
success: callbackFunc
});
}
function callbackFunc(response) {
// do something with the response
console.log(response);
}
postData('data to process');
If you only do some light computation and you have no problem working with a code deprecated as of jQuery 1.8, go with the synchronous approach. This is not recommended as it blocks the main thread.
function runPyScript(input){
var jqXHR = $.ajax({
type: "POST",
url: "/reverse_pca.py",
async: false,
data: { param: input }
});
return jqXHR.responseText;
}
// do something with the response
response= runPyScript('data to process');
console.log(response);
Read more about it here: How do I return the response from an asynchronous call? and http://api.jquery.com/jquery.ajax/
Solution 2:
After searching for few hours, I ended up having the following, and it worked well. Hope this helps someone else in future.
HTML and JS code: loging.html:
<html>
<head>
<title>Flask Intro - login page</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="static/bootstrap.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="http://code.jquery.com/jquery 2.1.4.min.js"></script>
</head>
<body>
<input id="submitbutton" type="submit" value="Test Send Data">
<!----------------------------------->
<script type="text/javascript">
function runPyScript(input){
var jqXHR = $.ajax({
type: "POST",
url: "/login",
async: false,
data: { mydata: input }
});
return jqXHR.responseText;
}
$('#submitbutton').click(function(){
datatosend = 'this is my matrix';
result = runPyScript(datatosend);
console.log('Got back ' + result);
});
</script>
Python code: app.py:
from flask import Flask, render_template, redirect, url_for,request
from flask import make_response
app = Flask(__name__)
@app.route("/")
def home():
return "hi"
@app.route("/index")
@app.route('/login', methods=['GET', 'POST'])
def login():
message = None
if request.method == 'POST':
datafromjs = request.form['mydata']
result = "return this"
resp = make_response('{"response": '+result+'}')
resp.headers['Content-Type'] = "application/json"
return resp
return render_template('login.html', message='')
if __name__ == "__main__":
app.run(debug = True)