AJAXを使用してFlaskサーバーにJSONデータを渡しますか？

Question

JQueryのフロントエンドによって生成された配列がいくつかあります。 （エドガー・ヘンリケスによって回答に基づいて）

EDIT1：

my_jq.js：

var a = ['one','two']; 
var b = ['three','four']; 
var c = ['five']; 
var d = ['six','seven','eight']; 
var e = ['nine','ten','eleven']; 
var newArray = []; 

//jsonify to send to the server 
$.ajax('/output', { 
    type: "POST", 
    contentType: "application/json", 
    dataType: "json", 
    data: JSON.stringify(postData), 
    success: function(data, status){ 
     console.log(newArray); 
     console.log(status);} 
}); 

私は、サーバー（フラスコ/のpython）に選択された値を渡していますし、それは計算していますデカルト製品。 EDIT2

<p>{{ element }}</p> 

：：私はその後、output.html

@app.route('/output', methods = ['GET','POST']) 
def output(): 
    data1 = request.get_json(force = True) 
    a = data1['a'] 
    b = data1['b'] 
    c = data1['c'] 
    d = data1['d'] 
    e = data1['e'] 
    newArray = [a,b,c,d,e] 
for element in itertools.product(*newArray): 
    print(element) 
    return jsonify(element) 
return render_template('output.html', element = element) 

output.html画面に出力を表示する必要が

このコードでは、/output.htmlが生成します。

"Bad Request 
Failed to decode JSON object: Expecting value: line 1 column 1 (char 0)" 

検査結果：

"Failed to load resource: the server responded with a status of 500 (INTERNAL SERVER ERROR)" 

なぜそれを認識しないのですか？

Answer 1

jqueryコードでは、JavaScriptオブジェクト（規約のための配列変数としてオブジェクトのプロパティの名前を付けることができます）を使用できます。このような何か：

var a = ['one','two']; 
var b = ['three','four']; 
var c = ['five']; 
var d = ['six','seven','eight']; 
var e = ['nine','ten','eleven']; 

var postData = { 
    a: a, 
    b: b, 
    c: c, 
    d: d, 
    e: e 
} 

$.ajax({ 
    url: "/output", 
    type: "POST", 
    contentType: "application/json", 
    data: JSON.stringify(postData), 
    success: function(data){/* do something */} 
}); 

バックサーバーでのあなたのような何かを行うことができます：あなたはあなたのために最善であるかを決定しかしちょうど

希望を覚えて、あなたのoutput.htmlの結果を表示することができます

@app.route('/output', methods=['POST']) 
def output(): 
    result = [] 
    data = request.get_json() 
    a = data['a'] #will give you array a 
    b = data['b'] #will give you array b 
    c = data['c'] #will give you array c 
    d = data['d'] #will give you array d 
    e = data['e'] #will give you array e 
    newArray = [a, b, c, d, e] 
    #To test you got the data do a print statement 

    print(newArray) 

    # The for loop is not necessary if you pass the newArray directly to 
    # your template "output.html". 
    # 
    #for element in newArray: 
    # result.append(element) 
    # 
    #like this 
    return render_template('output.html', element=newArray) 

を助けになる！