(5)Flask项目会员登录页

一、添加登录和登出的路由

修改app/home/views.py内容,增加登录("/login/")和登出("/logout/")的路由:

 1 # coding:utf8
 2 from . import home
 3 from flask import render_template, redirect, url_for
 4 
 5 @home.route("/")
 6 def index():
 7     return render_template("home/index.html")
 8 
 9 @home.route("/login/")
10 def login():
11     return render_template("home/login.html")
12 
13 @home.route("/logout/")
14 def logout():
15     return redirect(url_for("home.login"))

 

二、创建登录页

创建app/templates/home/login.html文件,内容:

 1 {% extends "home/home.html" %}
 2 
 3 {% block content %}
 4 <div class="row">
 5     <div class="col-md-4 col-md-offset-4">
 6         <div class="panel panel-primary">
 7             <div class="panel-heading">
 8                 <h3 class="panel-title"><span class="glyphicon glyphicon-log-in"></span>&nbsp;会员登录</h3>
 9             </div>
10             <div class="panel-body">
11                 <form role="form">
12                     <fieldset>
13                         <div class="form-group">
14                             <label for="input_contact"><span class="glyphicon glyphicon-user"></span>&nbsp;账号</label>
15                             <input id="input_contact" class="form-control input-lg" placeholder="用户名/邮箱/手机号码"
16                                    name="contact" type="text" autofocus>
17                         </div>
18                         <div class="col-md-12" id="error_contact"></div>
19                         <div class="form-group">
20                             <label for="input_password"><span class="glyphicon glyphicon-lock"></span>&nbsp;密码</label>
21                             <input id="input_password" class="form-control input-lg" placeholder="密码" name="password"
22                                    type="password" value="">
23                         </div>
24                         <div class="col-md-12" id="error_password"></div>
25                         <a href="user.html" class="btn btn-lg btn-success btn-block">登录</a>
26                     </fieldset>
27                 </form>
28             </div>
29         </div>
30     </div>
31 </div>
32 {% endblock %}

 

三、修改首页导航链接

修改app/templates/home/home.html页面导航中的登录和退出链接的URL:

 

四、运行查看效果

运行manage.py,并在浏览器访问http://127.0.0.1:5000/login/

 

尝试点击一下导航中的登录和退出按钮,都会跳转到登录页。

【结束】

 

posted @ 2019-06-20 00:07  xuebusi  阅读(420)  评论(0编辑  收藏  举报