javascript - Flask:不要重定向到 url()

Question

我正在开发一个基于flask、postgreSQL 构建的网络应用程序。它用于收集实验室数据并管理收集的数据。我附加的这个应用程序中有两个页面，用于显示用户通过从数据库查询选择的一些实验室的实验室数据。

一个页面 (admin_select_lab_for_data.html) 允许用户选择一些现有实验室，并将用户重定向到另一页面 (admin_edit_data.html)，该页面显示所选实验室中的所有数据。当我选择实验室并单击“转到实验室”按钮时，浏览器无法重定向到(admin_edit_data)。

python打印的输出都是正确的(这证明在flask中，发生了重定向，lab_ids被正确传递，并且所有相关数据被正确查询)。 http请求返回200 ok。然而，浏览器只是停留在同一页面上，ajax POST 请求会发出错误警报(这与 admin_select_lab_for_data 已收到数据的事实不一致)。

main.py

# review/edit Data
@app.route('/admin_select_lab_for_data',methods=['GET','POST'])
def admin_select_lab_for_data():
    if request.method=='POST':
        lab_ids = []
        jsonData = request.get_json()
        lab_ids = jsonData['lab_ids']        
        return redirect(url_for('admin_edit_data',lab_ids={'lab_ids':lab_ids}))
    lab_list = []
    db_session = db.get_session()
    for lab in db_session.query(schema.Lab_info).all():
        data_num = 0
        query_rows = db_session.query(schema.Lab_rows).filter(schema.Lab_rows.lab_id==lab.lab_id)
        for r in query_rows:
            data_num += db_session.query(schema.Lab_data).filter(schema.Lab_data.row_id==r.row_id).count()
        lab_list.append({'lab_id':lab.lab_id,'lab_name':lab.lab_name,'class_name':lab.class_name,'prof_name':lab.prof_name,'data_num':data_num})
    return render_template('admin_select_lab_for_data.html',lab_list=lab_list)


# review/edit Data
@app.route('/admin_edit_data')
def admin_edit_data():
    # Get a list of lab_ids that are needed to be retrieved
    lab_ids = ast.literal_eval(request.args['lab_ids'])['lab_ids']

    # lab_ids = ['test1_101_C','test2_101_N']
    lab_data = []
    lab_data_by_student = []
    row_names_list = []
    err_msg = ''

    db_session = db.get_session()

    #Group row data according to row_name
    query_rows = db_session.query(schema.Lab_rows).filter(schema.Lab_rows.lab_id==lab_ids[0]).order_by(schema.Lab_rows.row_order)
    for r in query_rows:
        lab_data.append({'row_name':r.row_name,'row_data_list':[]})
        row_names_list.append(r.row_name)


    for lab_id in lab_ids:
        query_rows = db_session.query(schema.Lab_rows).filter(schema.Lab_rows.lab_id==lab_id).order_by(schema.Lab_rows.row_order)
        index = 0

        #Check whether these labs are compatitble with each other(the number of rows and the names of rows must be the same)
        if query_rows.count()!=len(row_names_list):
            err_msg = lab_ids[0]+' and '+lab_id+' are incompatible: the number of rows is different-'+str(query_rows.count())+' and '+str(len(row_names_list))
        else:
            for r in query_rows:
                if (row_names_list[index]!=r.row_name):
                    err_msg = lab_ids[0]+' and '+lab_id+' are incompatible:'+row_names_list[index]+' and '+r.row_name+' are different row names' 
                    break
                else:
                    query_datas = db_session.query(schema.Lab_data).filter(schema.Lab_data.row_id==r.row_id).order_by(schema.Lab_data.data_id)
                    for data in query_datas:
                        lab_data[index]['row_data_list'].append({'lab_id':lab_id,'student_name':data.student_name,'data_id':data.data_id,'row_data':data.row_data})

                index+=1
        if err_msg!='':
            return render_template('admin_edit_data.html',lab_data=lab_data,student_data=lab_data_by_student,lab_ids=lab_ids,err_msg=err_msg)




    #Group row data according to student_name
    for row in lab_data:
        #sort row_data_list to make all the data across different lists 
        sorted(row['row_data_list'],key=lambda element:element['data_id'])
        # if list is empty, add student names into it
        if not lab_data_by_student:
            for data in row['row_data_list']:
                lab_data_by_student.append({'student_name':data['student_name'],'lab_id':data['lab_id'],'row_data_list':[]})

        for i in range(len(row['row_data_list'])):
            data = row['row_data_list'][i]
            lab_data_by_student[i]['row_data_list'].append({'row_name':row['row_name'],'row_data':data['row_data']})

    print('\n\n\n')
    print(lab_ids)
    print('\n\n\n')
    print(lab_data)
    print(lab_data_by_student)
    print(lab_ids)
    print(err_msg)
    print('\n\n\n')

    return render_template('admin_edit_data.html',lab_data=lab_data,student_data=lab_data_by_student,lab_id=lab_id,err_msg=err_msg)

admin_select_lab_for_data.html

{% extends "admin_home.html" %}
{% block head %}
    <meta charset="UTF-8">
    <title>Select lab for data</title>
    <script>
        $(document).ready(function(){
            $('button[name=go_to_lab]').click(function(){
                var lab_ids = [];
                var checkboxes = document.getElementsByTagName('input')
                for (var i = 0; i < checkboxes.length; i++) {
                    if (checkboxes[i].type == 'checkbox' && checkboxes[i].checked) {
                        lab_ids.push($(checkboxes[i]).data('labid'));   
                    }
                }
                if (lab_ids.length==0){
                    $('#error_message_no_lab_choose').show().delay(1000).fadeOut();
                }
                else{
                    $.ajax({
                          type: 'POST',
                          contentType: 'application/json',
                          dataType: 'json',
                          url: 'http://127.0.0.1:5000/admin_select_lab_for_data',
                          data: JSON.stringify({'lab_ids':lab_ids}),
                          success: function(result){
                                  alert('Submit successfully');
                                },
                          error : function(result){
                                  alert('Fail to submit');
                                  console.log(result)
                                }
                    });
                }

            });
        });
    </script>
{% endblock %}

{% block content %}

    {% if (lab_list|length)==0 %}
        No lab exists<br>
    {% else %}
        <table class="table">
            <thead>
                <tr>
                    <th class="tg-yw4l">Lab Index</th>
                    <th class="tg-yw4l">Lab Name</th>
                    <th class="tg-yw4l">Class Name</th>
                    <th class="tg-yw4l">Professor Name</th>
                    <th class="tg-yw4l">Number of data available</th>   
                     <th class="tg-yw4l">Choose</th>  
                </tr>
            </thead>
            <tbody>
            {% for lab in lab_list %}
                <tr>
                    <th class="tg-yw4l">{{loop.index}}</th>
                    <td class="tg-yw4l">{{lab.lab_name}}</td>
                    <td class="tg-yw4l">{{lab.class_name}}</td>
                    <td class="tg-yw4l">{{lab.prof_name}}</td>
                    <td class="tg-yw4l">{{lab.data_num}}</td>
                    <td class="tg-yw4l"><input type="checkbox" data-labid="{{lab.lab_id}}"></td>
                </tr>
            {% endfor %}
            </tbody>    
        </table>
        <br>
        <button name="go_to_lab">Go to lab</button>
        <div class="temporary_message" id="error_message_no_lab_choose">You need to select one lab</div>

{% endif %}



{% endblock %}

admin_edit_data.html

{% extends "admin_home.html" %}
{% block head %}
    <meta charset="UTF-8">
    <title>Edit Data</title>

{% endblock %}



{% block content %}


{% if lab_data|length==0 %}
<h1> No data available for this lab </h1> 
{% elif err_msg!="" %}
<h1> {{err_msg}} <h1>
{% else %}
    <table class="table" id={{lab_id}} name={{lab_data|length}}>
        <thead>
            <tr>
              <th>Index</th>
              <th>Student Name</th>
              <th>Lab ID</th>
              {%  for r in lab_data  %}
                  <th>{{r["row_name"]}}</th>
              {% endfor %}
            </tr>
        </thead>
        <tbody>
            {% for s in student_data %}
                <tr>
                    <th>{{loop.index}}</th>
                    <td><input value={{s["student_name"]}}></td>
                    <td>{{s["lab_id"]}}</td>
                    {%  for i in range(lab_data|length)  %}
                        <td><input value={{s["row_data_list"][i]["row_data"]}}></td>
                    {% endfor %}
                    <td><button name=save_all>Save All</button></td>
                    <td><button name=delete>Delete</button></td>
                </tr>
            {% endfor %}        
        </tbody>
    </table>
    <button><a href="/admin_select_lab_for_data">Return</a></button>

{% endif%}

{% endblock %}

Answer 1

您永远无法通过 Ajax post 请求实现页面重定向。

您要么必须提交常规表单帖子并执行重定向，要么需要从 Ajax 调用返回结果并使用浏览器中的 window.location 更改页面。