Javascript 从JS调用python函数_Javascript_Python

Javascript 从JS调用python函数

javascript python

Javascript 从JS调用python函数,javascript,python,Javascript,Python,我试图从JavaScript代码中调用Python中的函数。我使用了解释过的代码，但它不适合我以下是我的JS代码： <!DOCTYPE html> <body> <script type="text/javascript" src="d3/d3.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js">&l

我试图从JavaScript代码中调用Python中的函数。我使用了解释过的代码，但它不适合我

以下是我的JS代码：

<!DOCTYPE html>
<body>
<script type="text/javascript" src="d3/d3.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>  
<script>
text ="xx";

$.ajax({
type: "POST",
url: "~/reverse_pca.py",
data: { param: text}
}).done(function(o) {
    console.log(data);
    console.log(text);
});

您知道它出了什么问题吗？

除了上述几点之外，假设您已经有了一个适当的设置来为python脚本提供服务并返回响应。您应该提交一个异步请求，尤其是当python代码执行一些繁重的计算时

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');

如果您只做一些简单的计算，并且使用jQuery1.8中不推荐使用的代码没有问题，请使用同步方法。这是不推荐的，因为它会阻塞主线程

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);

在这里阅读更多信息：

在搜索了几个小时后，我得到了以下信息，而且效果很好。希望这对以后的其他人有帮助

HTML和JS代码：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>

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)

~/reverse\u pca.py

是一条相对路径，看起来它应该是一条绝对路径。无论如何，您应该提到任何错误消息（因为“不工作”可能意味着很多事情），并且您应该查看web服务器日志。非常感谢！！这很有帮助。

未定义@henos jQuery文件未加载。原始URL有一个错误。这部分“jquery 2.1.4”应该是“jquery-2.1.4”，用连字符而不是空格。

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)