javascript +フラスコ - json配列をPOSTリクエスト経由でサーバーに渡す適切な方法はありますか？

Question

私は、サーバーの使用ポスト要求にJSON配列を渡す必要があります：

<form action="../../../submit/" method='post' style="margin-top:-10px" id="submitBox"> 

    <input class="attr" type="text" name="task_url" value= "annotate/{{task_name}}/{{taskid}}/{{frame_idx+1}}" hidden> 
    <input class="attr" type="text" name="frame_id" value= "{{frame.id}}" hidden> 
    <input class="attr" type="text" name="boxes_info" value = "" hidden id="boxes_info"> 
    <button class="btn btn-default" id="submit" class="attr_sub"> 
     <span class="glyphicon glyphicon-ok-circle"></span> 
     Submit 
    </button> 
</form> 

、ここでは、私はJSON配列を作成し、入力値にサーバー側の

d3.select('#submit').on('click', function(){ 
    var boxes = []; 
    var box  = {}; 
    d3.selectAll('rect').each(function(){ 
    var rect = d3.select(this) 
    box['xmin'] = rect.attr('x'); 
    box['ymin'] = rect.attr('y'); 
    box['width'] = rect.attr('width'); 
    box['height'] = rect.attr('height'); 
    box['label'] = rect.attr('class'); 
    boxes.push(JSON.stringify(box)); 

    }) 
    boxes = JSON.stringify(boxes); 
    d3.select('#boxes_info').attr('value',boxes); 
}) 

を渡す方法ですフォームデータを取得してください：

bboxes   = request.form["boxes_info"] 
bboxes = json.loads(bboxes) 
print bboxes[0]['xmin']  // error: string indices must be integers 
print bboxes[0][0]   // return '{' 


print bboxes 
//[u'{"xmin":"433.9936102236422","ymin":"4.8","width":"404.2108626198083","height":"461.96","label":"person"}', u'{"xmin":"433.9936102236422","ymin":"-18.2","width":"404.2108626198083","height":"20","label":"person"}', u'{"xmin":"490.73482428115017","ymin":"291.84","width":"286.517571884984","height":"197.44","label":"handbag"}', u'{"xmin":"490.73482428115017","ymin":"268.84","width":"286.517571884984","height":"20","label":"handbag"}'] 

私はjson.loads('bboxes[0]')のように見えます。私は自分のコードで何か問題があると思う。誰かが私にそのような正しい方法が何であるか教えてもらえますか？

Answer 1

クライアントでJSON.stringifyを2回実行したようです。そのため、サーバー上でjson.loadsを2回実行する必要があります。

あなたのコード（簡体字）：bboxesを印刷し、出力を表示してください

d3.select('#submit').on('click', function(){ 
    d3.selectAll('rect').each(function(){ 
    ... 
    boxes.push(box); // don't stringify heare 

    }) 
    boxes = JSON.stringify(boxes); // stringify the array 
})