jquery - Flask如何在ajax调用后重定向到新页面

Question

这个问题已经有答案了:

How to manage a redirect request after a jQuery Ajax call (34 个回答)

已关闭 5 年前。

我尝试在ajax发布后重定向到新页面，但还没有成功。

我的模板如下所示:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript">
 $(function() {

     var selectedForm = 0;

     function doWork() {
         var response = $('#reply1').val();
         console.log(response);
         $.post({url: "receiver", data: JSON.stringify({selectedForm: selectedForm, response : response}),
                 contentType: "application/json", success: function(){}});
     }

     $('.respondButton').click(function(e) {
         e.preventDefault();
         var selectedButton = $(this).attr('id');
         selectedForm = selectedButton.replace('response', '');
         console.log(selectedForm);
     });

     $('#submitButton1').click(function(e) {
         e.preventDefault();
         doWork();
     });

 });
</script>

HTML 部分:

<a id="response1" href="" class="respondButton">
    <span>response1</span>
</a>

<a id="response2" href="" class="respondButton">
    <span>response2</span>
</a>

<form  action="/receiver" method="post" id="form1" name="form1">
    <textarea type="text"  rows ="3" name="reply1" id="reply1"></textarea>
    <button type="submit"  name="submitButton1" id="submitButton1">Submit</button>
</form>

在服务器端 Flask 应用程序如下所示:

#!flask/bin/python

import sys

from flask import Flask, render_template, request, redirect, Response, url_for
import random, json

app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/somepage')
def somepage():
    return 'Success'


@app.route('/receiver', methods = ['POST'])
def worker():

    data = request.get_json()
    result = ''
    result = str(data)

    print(result)

    return (redirect(url_for('somepage')))


if __name__ == '__main__':

    app.run(debug=True)

当我打开 Chrome 开发者工具并单击网络时，它看起来不错，我可能会看到成功消息，但浏览器仍然不会重定向到 /somepage

Answer 1

正如我在您的 Flask 应用程序中看到的，您尝试输出数据并重定向到主页，但应用程序将执行输出部分(即消息)，并且不会继续重定向，如果您需要进行重定向，您应该在 ajax 调用中进行。

success: function(){
    window.location.href = "somepage";
}