2015-08-29 13 views
8

Sto provando a chiamare una funzione in Python dal mio codice JavaScript. Ho usato il codice spiegato here ma non funziona per me.Chiama la funzione python da JS

Ecco il mio codice 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); 
}); 

codice Python:

import csv 
from numpy import genfromtxt 
from numpy import matrix 

def main(): 
    ... 
    return x 
if __name__ == "__main__": 
    x=main() 
    return x; 

Sapete che cosa è sbagliato con esso?

+1

'~/reverse_pca.py' è un percorso relativo e sembra che vuole essere un percorso assoluto. Ad ogni modo, dovresti menzionare qualsiasi messaggio di errore (perché "non funziona" può significare molte cose) e dovresti guardare i log del server web. – betterworld

risposta

7

Oltre ai punti citati e presupponendo che si disponga già di una corretta installazione per servire il proprio script python e restituire la risposta. Dovresti inviare una richiesta asincrona, specialmente se il codice Python esegue un calcolo pesante.

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

Se fare solo alcuni calcoli di luce e non hanno alcun problema a lavorare con un codice deprecato come di jQuery 1.8, andare con l'approccio sincrono. Questo è sconsigliato poiché blocca il thread principale.

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

Per saperne di più su di esso qui: How do I return the response from an asynchronous call? e http://api.jquery.com/jquery.ajax/

2

Dopo aver cercato per qualche ora ho finito per avere questa e funziona perfettamente. Spero che questo aiuti qualcun altro in futuro.

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)