Python CGI-如果登录验证失败,则在html页面上显示一条消息

时间:2018-12-08 13:59:18

标签: javascript python bootstrap-4 cgi

我正在使用Python CGI(稍后将转向WSGI)。我已经编写了一个普通的html页面,其中包含在引导程序中创建的用于表单验证的表单。我可以将表单值发送到Python CGI脚本。如果在服务器端验证用户名失败,那么我想在同一页面上显示一条消息,提示用户名或密码失败。我怎样才能做到这一点?我曾尝试在Google中进行搜索,但大多数问题是将数据传递给CGI脚本。

我想要的是如果输入的用户名错误,则显示一条消息“用户名错误”,如果在同一页面上输入的密码错误,则显示“密码错误”。当我简单地编写CGI脚本时,它将显示一个新页面。

login.html

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Insurance Login Portal</title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>  
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>  
  <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.3/js/bootstrapValidator.min.js"> </script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
  <script src='http://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js'></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>

  <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.3/css/bootstrapValidator.min.css"/>
  <link href="http://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">


    <style>
      form {
        /* Just to center the form on the page */
        margin: 0 auto;
        width: 80%;
        /* To see the outline of the form */
        padding: 3em;
        border: 3px solid #99bbff;
        border-radius: 1em;
      }

      input:focus{
        /* To give a little highlight on active elements */
        border-color: #007bff;
        color: black;
      }

      .has-error .help-block {
        color: red;
    }
    </style>
</head>
<body>
      <img src=/images/logo.jpg alt="bajaj car insurance logo" />
        <nav class="navbar navbar-expand-sm bg-primary navbar-dark">
          <!-- Brand -->
          <a class="navbar-brand" href="/index.html">Home</a>
          <a class="navbar-brand" href="/insure.html">Online Insurance</a>
          <a class="navbar-brand" href="/renewal.html">Renewal of Insurance</a>
          <a class="navbar-brand" href="/claim.html">Claim Insurance</a>
          <a class="navbar-brand" href="/login.html">Admin Login</a>
        </nav>

        <br>
        <br>

        <form id="loginForm" name ="loginForm" method="post" class="form-horizontal">
            <div class="form-group ">
                <br>
                <label class="control-label col-sm-7">Email</label>
                <div class="col-sm-9">
                    <input type="text" class="form-control" name="email" />
                </div>
            </div>
            <br>
            <div class="form-group">
                <label class="col-sm-7 control-label">Password</label>
                <div class="col-sm-9">
                    <input type="password" class="form-control" name="password" />
                </div>
            </div>

            <!-- #messages is where the messages are placed inside -->
            <div class="form-group">
                <div class="col-md-9 col-md-offset-3">
                    <div id="message"></div>
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-12 centered">
                    <!--button type="submit" class="btn btn-default">Login</button-->
                    <input value="Submit" type="button" onclick="http://127.0.0.1/cgi-bin/login.py"></p>
                    <div id="result"></div>

                </div>
            </div>
        </form>
        <script>
            $(document).ready(function() {
                $('#loginForm').bootstrapValidator({
                    container: '#messages',
                    feedbackIcons: {
                        valid: 'glyphicon glyphicon-ok',
                        invalid: 'glyphicon glyphicon-remove',
                        validating: 'glyphicon glyphicon-refresh'
                    },
                    fields: {
                        email: {
                            validators: {
                                notEmpty: {
                                    message: 'The email address is required and cannot be empty'
                                },
                                emailAddress: {
                                    message: 'The email address is not valid'
                                }
                            }
                        },

                        password: {
                                validators: {
                                    notEmpty: {
                                        message: 'The password is required'
                                    },
                                    stringLength: {
                                        min: 8,
                                        message: 'The password must have at least 8 characters'
                                    }
                                }
                        }
                    }
                });
            });
        </script>


 

login.py

form = cgi.FieldStorage()
print("Content-type: text/html\n\n")
#connect to database
dbConnection = DBConnection()
conn = dbConnection.get_connection_object()
cursor = conn.cursor()
#get username from login form
username = form.getvalue('username')
#print(username)
#check if the user name is present in the database
sql = "select * from admin_login where admin_user_email = '%s'"
#print(sql % username)
cursor.execute(sql % username)
row = cursor.fetchone()
if row is not None:
    print('welcome',row[0])
else:
    print('wrong username')

0 个答案:

没有答案