从Ajax向Flask发出POST请求后，页面未渲染。

Question

我正在使用FLASK + Ajax制作登录页面。在用户名和密码正确的情况下，它应该重定向到另一个页面。

我做了一个表单。请求已经成功传递。我可以在Python（Flask）中捕获数据。但我的问题是在使用render_template渲染页面后没有重定向发生。

以下是在请求根URL时重定向到登录页面的代码：

@app.route('/')
def OperationPage():
    log_screenprint('User Has Requested / URL >> Redirect to /login')
    return  redirect(url_for('page_login'))

这是验证用户名和密码的函数，然后应该重定向到下一个页面。

@app.route('/login' , methods=["POST","GET"])
def page_login() :
    log_screenprint('Got Request From GUI User to login With Cred.')

    for key,value in securityFile.items() :
        dbUser = securityFile[key]['username']
        dbpass = securityFile[key]['defaultpass']

        username = request.form.get('username')
        password = request.form.get('password')
        sessionId = request.form.get('session')

        if dbUser == username :
            if dbpass == password :
                socketio.emit('userDb' , json.dumps(securityFile[key]) , session = sessionId)
                return render_template('/index.html' ,  title= 'Home Page')

    return render_template('/login.html')

以下是我在 JavaScript 中使用的请求。

  $('#login-form').submit(function (e) {
  e.preventDefault();
  var username = document.querySelector('.login-username').value
  var password = document.querySelector('.login-password').value
    $.ajax({
      url: '/login',
      data: {
              username: username,
              password: password,
              session : (socket.id),
          },
        type: 'POST',
        success: function (response) {
          console.log('response');
        },
        error: function (error) {
          console.log(error);
        }
      });
  });

问题再次出现。即使输入正确的用户名和密码，index.html也未能呈现。

- JoQuery

---

你应该将标签从java改为javascript。 - Ofek

Answer 1

当使用ajax时，你需要处理服务器的响应。服务器返回的响应是一个HTML网页（index.html），你需要展示给用户。在这种情况下，你只需要将单词“response”打印到网页控制台：

success: function (response) {
  console.log('response');
},

我建议用另一种方式来做。我会创建另一条路线：

@app.route('/index')
def index():
    return render_template('/index.html' ,  title= 'Home Page')

并在服务器响应成功时将用户重定向到它。

success: function (response) {
  window.location.replace('index')
},

它还需要对身份验证功能进行一些更改，因为您的服务器每次都返回成功的HTTP代码。 您可以使用类似以下内容的方法：

return "", 200

登录成功，以及

return "", 401

失败了。

- softartisan