のpythonフラスコrender_template HTMLが正しく

私は、ユーザーがログイン実装のpythonフラスコアプリを構築していますレンダリングされませんでした、succefullyにおけるユーザログの後、それはreturn render_template('userHome.html') を実行するためにuserHome.htmlのpythonフラスコrender_template HTMLが正しく

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Python Flask Bucket List App</title> 
    <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet"> 
  
    <link href="http://getbootstrap.com/examples/jumbotron-narrow/jumbotron-narrow.css" rel="stylesheet"> 
    <link href="../static/css/signup.css" rel="stylesheet"> 
</head> 
<body> 
    <div class="container"> 
        <div class="header"> 
            <nav> 
                <ul class="nav nav-pills pull-right"> 
                    <li role="presentation" class="active"><a href="/logout">Logout</a> 
                    </li> 
                </ul> 
            </nav> 
            <h3 class="text-muted">Python Flask App</h3> 
        </div> 
  
        <div class="jumbotron"> 
            <h1>Welcome Home !!</h1>   
        </div>  
        <footer class="footer"> 
            <p>&copy; Company 2015</p> 
        </footer>   
    </div> 
</body> 
</html>

とPythonコードにリダイレクトされますvalidateLogin中：

@app.route('/validateLogin',methods=['POST']) 
def validateLogin(): 
cursor = None 
try: 
     _username = request.form['inputName'] 
     _password = request.form['inputPassword'] 

    # connect to mysql 

     conn = mysql.connect() 
     cursor = conn.cursor() 
     cursor.callproc('sp_validateLogin',(_username,_password)) 
     data = cursor.fetchall() 

     if len(data) > 0:    
     return render_template('userHome.html') 
     else: 
     return render_template('error.html', error = "Wrong Username or 
     Password")   

    except Exception as e: 
     return render_template('error.html',error = str(e)) 
    finally: 
     if cursor: 
      cursor.close() 
      conn.close()

とsignin.js：

最後に signin.html

と：

!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <title>Sign In</title> 


    <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet"> 

    <link href="http://getbootstrap.com/examples/jumbotron-narrow/jumbotron-narrow.css" rel="stylesheet"> 
    <link href="../static/signup.css" rel="stylesheet"> 
    <script src="/static/js/jquery-3.1.1.js"></script> 
    <!--<script src="/static/js/jquery-3.1.1.min.map"></script>--> 
    <script src="/static/js/signin.js"></script> 

    </head> 

    <body> 

    <div class="container"> 
     <div class="header"> 
     <nav> 
      <ul class="nav nav-pills pull-right"> 
      <li role="presentation" ><a href="main">Home</a></li> 
      <li role="presentation" class="active"><a href="#">Sign In</a></li> 
      <li role="presentation"><a href="showSignUp">Sign Up</a></li> 

      </ul> 
     </nav> 
     <h2 class="text-muted">Release Control System</h2> 
     </div> 

     <div class="jumbotron"> 
     <h1>Log In</h1> 
     <form class="form-signin"> 
     <label for="inputName" class="sr-only">Name</label> 
     <input type="name" name="inputName" id="inputName" class="form-control" placeholder="Name" required autofocus> 
     <!--<label for="inputEmail" class="sr-only">Email address</label> 
     <input type="email" name="inputEmail" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>--> 
     <label for="inputPassword" class="sr-only">Password</label> 
     <input type="password" name="inputPassword" id="inputPassword" class="form-control" placeholder="Password" required> 

     <button id="btnSignIn" class="btn btn-lg btn-primary btn-block" type="button">Sign in</button> 
     </form> 
     </div> 



     <footer class="footer"> 
     <p>Copyright 2017 Foxconn CABG &copy; All Rights Reserved.</p> 
     </footer> 

    </div> 
    </body> 
</html>

私がログインしたときに成功し、それはuserHome.htmlページへの直接しないが、それはすべてのHTMLエンティティ代わりを示しました。テンプレートは機能していますが、ブラウザは誤って処理しています。

私はのような多くのトリックを試してみた：

headers = {'Content-Type': 'text/html'} 
    return make_response(render_template('userHome.html'),200,headers)

それはまだhtmlエンティティではなく、HTMLページを返します。これは数日前に私を混乱させてくれました。

出典

2017-02-23 Samoth

ユーザーの資格情報を入力する方法は？私はユーザー名とパスワードの入力を意味します。 – metmirr

はい、私はユーザー名とパスワードを入力して入力し、サインインボタンをクリックしました。 – Samoth

はい、そのページをどのようにレンダリングしますか？あなたもそのコードを共有できますか？ – metmirr

私はリダイレクトリクエストをajaxに送信して実行する方法を知らないので、私は物事を分かち合うだけです。

# Python Code 
@app.route('/login') 
def login(): 
    # check if user is not logged in then render the login form 
    if user_not_logged_in(): 
     return render_template('login_form.html') 
    # if user logged in, then redirect to userHome 
    else: 
     return redirect(url_for('userHome')) 

from flask import jsonify 
@app.route('/validateLogin', methods=['POST']) 
def validateLogin(): 
    # do some stuff and check for validation 
    if stuff_goes_well: 
     return jsonify({'data': 'success'}) 
    else: 
     return jsonify({'data': 'failure'}) 

@app.route('/userHome') 
def userHome(): 
    # check if user is logged in 
    if logged_in_user_session_exists(): 
     return render_template('userHome.html') 
    else: 
     # user is not logged in so redirect him to the login page 
     return redirect(url_for('login')) 

# jQuery code 
$.ajax({ 
    url: "/validateLogin", 
    type: "POST", 
    dataType: "json", 
    data: data_here, 
    success: function(response){ 
     if(response.data == 'success'){ 
      # success was sent so the user logged in successfully, redirect to user home 
      window.location.replace('/userHome'); 
     }else{ 
      # there was an error in the logging in 
      alert('there was an error!'); 
     } 
    } 
});

簡単に言えば、ajaxでデータをPythonに送信するだけです。 Pythonで検証とデータの解析を処理させます。すべてがうまくいけば、jQueryに "ちょっとここでクールだよ"（これは私たちが送る "成功"文字列で表されます）と伝えてください。何かが間違っていた場合は、jQueryに問題があったため、送信する '失敗'文字列を返します。 jQueryでは送信された文字列を処理します。成功した場合は、ユーザーを目的のURL（この場合は/ userHome）にリダイレクトします。失敗が送られた場合、エラーがあったと言います。

ユーザーが単にURLに「/ USERHOME」と入力し、彼がログインしていない間、ページを単に表示することができないように、これらのpythonチェックが重要であることに注意してください。

私はあなたが見つけることを願ってこれは便利です。

出典

2017-02-23 05:09:03

ありがとう、はい私は 'redirect'も試みましたが、まだHTMLエンティティを返しています – Samoth

ああ、私は今それを得ると思います。あなたはAjaxでログインしています。私は気づいていません。あなたはajaxにリダイレクト要求を送信することはできません（少なくとも私は方法はわかりません）。しかし、私がいつもやっていることは、セッションと検証をしてから、ajaxにユニークな成功メッセージを送り、次にwindow.location.replace（new_url）を使ってjQuery自体（または実際にはjs）を使ってリダイレクトすることです。それが意味をなさないなら、私に教えてください。そして私はサンプルコードを投稿します。 –

はい、親切に例コードを投稿してください。ありがとう。 – Samoth

のpythonフラスコrender_template HTMLが正しく

答えて

関連する問題