烧瓶：请求方法=='POST'跳过返回语句

Question

我的应用程序出现了一个奇怪的问题。

我正在做的是：我在JS(客户端(中生成了一个csv文件，然后将其发送到flask，然后在那里使用python脚本过滤文件，然后返回给客户端。

除了最后一部分，一切都很好。当涉及到返回render_template时，它只是跳过该部分。这很奇怪，因为它进入if request.method=='POST'内部。我在if request.method='POST'中打印了值，我可以在服务器端看到这些值。

烧瓶路线.py:

@app.route('/update_file', methods=['GET', 'POST'])
@login_required
def update_file():
'''Opens the filtered_file page but with updated file'''
clicked = None
if request.method == 'POST':
clicked = io.StringIO(request.form['data'])
file_to_filter = pd.read_csv(clicked, sep=',', engine='python', encoding='utf_8_sig')
table1 = update_csv(file_to_filter)
print(table1)
table2 = table1.to_html(classes='my_class" id = "my_id')
return render_template('3_filtered_file.html', data=table2)

这就是我在我的html模板上显示它的方式：

<div class="table-responsive">
{{data | safe}}
</div>

我已经对客户端上传的文件做了类似的处理，效果很好，但这一个有一个错误，我似乎找不到：/

编辑：这是我发送ajax请求的JS：

//On Update click renders table to csv, activates the be_filter and reopens it in the filtered_file.html
var isClicked;
jQuery("#update").on('click', function(){
var response = confirm('Are you sure you want to UPDATE rows ?');
if(response == true){                    
isClicked = $('#my_id').table2csv();
$.ajax({
type:'POST',
url:"{{url_for('update_file')}}",
data: {'data': isClicked}
});
//window.location.href='/update_file';
}else{
return false;
}
});

Answer 1

这里的问题是，当你应该提交表单时，你却在使用AJAX。AJAX主要是在后台与服务器进行通信，但您正试图将其用作以编程方式提交POST表单数据的工具。使用AJAX会像单击链接或提交表单一样向服务器发送请求，但浏览器不会导航到结果。这就是为什么您得出结论，flask跳过了render_template调用，但模板确实得到了渲染。只是使用AJAX调用，回复只会出现在AJAX成功回调中，而不会出现在浏览器的主窗口中。

在这样的AJAX请求的情况下，不需要发回HTML。例如，您可以简单地返回"update successful"。

您可以通过从客户端手动重定向到结果页面来修复现有代码：

// in your $.ajax() options:
success: function(reply) {
if (reply == "update successful") location = "/table"; // URL of table view
else alert("server reports error");
}

这将在AJAX调用成功更新服务器上的CSV文件后在客户端上重定向。

然而，您可以简单地提交一份实际的表格：

<form id="tableDataForm" method="post" action="{{url_for('update_file')}}">
<input type="hidden" name="data" id="tableData">
</form>

$("#update").on('click', function(){
$('#tableData').val($('#my_id').table2csv()); // insert data into hidden <input>
$('#tableDataForm').submit();  // send POST request
});

这就是你所需要的。现在浏览器将再次显示烧瓶发回的回复。