本篇文章给大家带来的内容是关于python中flask_bootstrap装饰网页的介绍(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
flask_bootstrap
Bootstrap 是 Twitter 开发的一个开源框架,它提供的用户界面组件可用于创建整洁且具有吸引力的网页,而且这些网页还能兼容所有现代 Web 浏览器.
Bootstrap 是客户端框架,因此不会直接涉及服务器。服务器需要做的只是提供引用了 Bootstrap 层叠样式表(CSS)和 JavaScript 文件的 HTML 响应, 并且 HTML、CSS 和 JavaScript 代码中实例化所需组件。这些操作最理想的执行场所就是模版。
Flask-Bootstrap 可以在程序中集成 Bootstrap
安装:
pip install flask-bootstrap
使用:
from flask_bootstrap import Bootstrap ...... bootstrap = Bootstrap(app)
html文件的继承
初始化 Flask-Bootstrap 之后,就可以在程序中使用一个包含所有Bootstrap 文件的基模版。这个模版利用 Jinja2 的模版继承机制,让程序扩展一个具有基本页面结构的基模版,其中就有用来引入 Bootstrap 的元素。
bootstrap的base.html文档:
{% block doc -%} <!DOCTYPE html> <html{% block html_attribs %}{% endblock html_attribs %}> {%- block html %} <head> {%- block head %} <title>{% block title %}{{title|default}}{% endblock title %}</title> {%- block metas %} <meta name="viewport" content="width=device-width, initial-scale=1.0"> {%- endblock metas %} {%- block styles %} <!-- Bootstrap --> <link href="{{bootstrap_find_resource('css/bootstrap.css', cdn='bootstrap')}}" rel="stylesheet"> {%- endblock styles %} {%- endblock head %} </head> <body{% block body_attribs %}{% endblock body_attribs %}> {% block body -%} {% block navbar %} {%- endblock navbar %} {% block content -%} {%- endblock content %} {% block scripts %} <script src="{{bootstrap_find_resource('jquery.js', cdn='jquery')}}"></script> <script src="{{bootstrap_find_resource('js/bootstrap.js', cdn='bootstrap')}}"></script> {%- endblock scripts %} {%- endblock body %} </body> {%- endblock html %} </html> {% endblock doc -%}
继承Bootstrap 文件的基模版,编写适用于自己项目的基模板。
{#自己编写一个基类模板#} {% extends 'bootstrap/base.html' %} {% block styles %} {{ super() }} <link rel="stylesheet" href="../static/css/main.css"> {% endblock %} {% block navbar %} <nav class="navbar navbar-default"> <p class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <p class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html"></a> </p> <!-- Collect the nav links, forms, and other content for toggling --> <p class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="#">首页<span class="sr-only">(current)</span></a></li> <li><a href="#">新闻</a></li> <li><a href="#">国际</a></li> <li><a href="#">国内</a></li> <li><a href="/sysinfo/">系统信息</a></li> <li><a href="#">登陆用户</a></li> </ul> <ul class="nav navbar-nav navbar-right"> {% if 'user' in session %} <li><a href="login.html"><span class="glyphicon glyphicon-user"></span> {{ session.user }}</a></li> <li><a href="/logout/"><span class="glyphicon glyphicon-log-in"></span> 注销 </a></li> {% else %} <li><a href="/login/"><span class="glyphicon glyphicon-log-in"></span> 登陆</a></li> {% endif %} <li><a href="/register/"><span class="glyphicon glyphicon-log-out"></span> 注册</a></li> </ul> </p><!-- /.navbar-collapse --> </p><!-- /.container-fluid --> </nav> {% endblock %} {% block content %} {#定义属于自己的block#} {% block newcontent %} {% endblock %} {% block footer %} <p class="footer"> 宇宙大魔王--ZAJ </p> {% endblock %} {% endblock %}
Jinja2 中的 extends 指令从 Flask-Bootstrap 中导入 bootstrap/base.html,从而实现模版继承。Flask-Bootstrap 中的基模版提供了一个网页框架,引入了 Bootstrap 中的所有 CSS 和 JavaScript 文件。
上面这个示例重新定义了3个块,分别是对 bootstrap/base.html的styles、navbar和content的改写。这些块都是基模版提供的,可在衍生模版中重新定义。
如果程序需要向已经有内容的块中添加新内容, 必须使用 Jinja2 提供的 super() 函数。例如,如果要在衍生模版中添加新的 CSS 文件,需要这么定义:
{% block styles %} {{ super() }} <link rel="stylesheet" href="../static/css/main.css"> {% endblock %}
使flask_bootstrap和flask_wtf编写一个FLASK项目
要求:
实现网页主页显示、登陆页面显示、注册页面显示、用户退出(注销)。并且只有数据库中存在用户可以登陆网页。主要通过表单来实现数据交互。目前,对于用户注册,不返回数据库。
模板文件有templates/base.html , templates/index.html , templates/login.html , templates/register.html Py文件有 zaj_run.py , zaj_ forms.py , zaj_modles.py , zaj_config.py
模板文件链接
链接:https://pan.baidu.com/s/1Uov-i8b2fZMr9fOe32tcgg 提取码:jrbs
# zaj_run.py from flask import Flask,render_template,session,redirect,url_for from flask_bootstrap import Bootstrap from zaj_forms import LoginForm,RegisterFrom from zaj_models import isPasswdOk import functools app = Flask(__name__) app.config['SECRET_KEY'] = 'SHEEN' bootstrap = Bootstrap(app) def is_login(f): """判断用户是否登陆的装饰器""" @functools.wraps(f) def wrapper(*args, **kwargs): # 主函数代码里面, 如果登陆, session加入user, passwd两个key值; # 主函数代码里面, 如果注销, session删除user, passwd两个key值; # 如果没有登陆成功, 则跳转到登陆界面 if 'user' not in session: return redirect('/login/') # 如果用户是登陆状态, 则访问哪个路由, 就执行哪个路由对应的视图函数; return f(*args, **kwargs) return wrapper @app.route('/') def index(): return render_template('index.html') @app.route('/login/',methods=['GET','POST']) def login(): # session.pop('user',None) # session.pop('passwd',None) form = LoginForm() print(form.data) #{'user': 'root123', 'passwd': 'sheen123', 'submit': True,....} if form.validate_on_submit(): user = form.data['user'] passwd = form.data['passwd'] if isPasswdOk(user,passwd): session['user'] = user session['passwd'] = passwd return redirect(url_for('index')) else: return render_template('login.html',form=form,message='密码或用户名错误') else: return render_template('login.html',form=form) @app.route('/register/',methods=['GET','POST']) def register(): form = RegisterFrom() # 如果是post方法并且表单验证通过的话, 返回True; if form.validate_on_submit(): # 用户提交的表单信息 print(form.data) return 'ok' return render_template('register.html', form=form) @app.route('/logout/') def logout(): session.pop('user', None) session.pop('passwd', None) # 注销即删除用户的session信息, 注销成功, 跳转到首页; return redirect(url_for('index')) # return redirect('/') if __name__ == '__main__': app.run( port = 8900) # 报错1:TypeError: __init__() takes from 1 to 2 positional arguments but 3 were given # 解决:把输入表单LoginForm,RegisterFrom中的Required去掉 # 问题2:每次重新运行程序,都会显示root123用户已登陆,即session里面有数据 # 解决:添加判别session内容的函数is_login()。
# zaj_models.py,存放数据库操作 import pymysql from zaj_config import DB # 1. 创建连接 conn = pymysql.connect( host=DB.HOST, user = DB.USER, passwd = DB.PASSWD, port = DB.PORT, db = DB.DBNAME, ) cur = conn.cursor() def isUserExist(username): """判断用户名是否存在""" sqli = "select * from user where name='%s'" %(username) res = cur.execute(sqli) # res返回的是sql语句查询结果的个数; # 如果为0, 没有查到。 if res == 0: return False else: return True def isPasswdOk(username, passwd): sqli = "select * from user where name='%s' and passwd='%s'" %( username, passwd) res = cur.execute(sqli) if res == 0 : return False else: return True def addUser(username, passwd): """用户注册时, 添加信息到数据库中""" sqli = "insert into user(name, passwd) values('%s', '%s')" %( username, passwd) try: res = cur.execute(sqli) conn.commit() except Exception as e: conn.rollback() return e # # cur.close() # conn.close() if __name__ == "__main__": addUser('root', 'root') print(isUserExist('root')) print(isPasswdOk('root', 'root'))
# zaj_forms.py,存放表单操作 from flask_wtf import FlaskForm # 每个Web表单都由一个继承自FlaskForm的类表示 from wtforms import StringField,PasswordField,SubmitField # StringField类表示的是属性为type="text"的<input>元素。 # SubmitField类表示的是是属性为type="submit"的<input>元素 #WTForms内建的验证函数validators,而且是以数组形式,正对应了前面说的一个字段可以有一个或者多个验证函数 from wtforms.validators import Length, Required, EqualTo, Regexp,Email class LoginForm(FlaskForm): user = StringField( label='用户名', validators=[ Length(5,13) ] ) passwd = PasswordField( label='密码', validators=[ Length(6,12), ] ) submit = SubmitField( label='登陆' ) class RegisterFrom(FlaskForm): user = StringField( label='用户名/邮箱/手机号', validators=[ Length(5,13) ] ) passwd = PasswordField( label='密码', validators=[ Length(6,12), ] ) repasswd = PasswordField( label='确认密码', validators=[ EqualTo('passwd',message='密码不一致!') ] ) phone = StringField( label='电话号码', validators=[ Regexp(r'1\d{10}', message='手机号码格式错误') ] ) email = StringField( label='邮箱', validators=[ Email(message='邮箱格式错误!') ] ) submit = SubmitField( label='注册' )
# zaj_config.py , 存放数据库类 class DB: HOST = 'localhost' USER= 'root' PASSWD = 'sheen' PORT = 3306 DBNAME = 'zaj_form'
确保数据库zaj_form中已有表user,user有元素name,passwd,添加用户name= ‘python’ , passwd=’1234567’
主页:
登陆之后,自动跳转主页,显示session的缓存。
当注册表单某一项不满足程序定义的规则时
当注册成功时,返回'OK'
Atas ialah kandungan terperinci python中flask_bootstrap装饰网页的介绍(附代码). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Anda boleh mempelajari konsep pengaturcaraan asas dan kemahiran Python dalam masa 2 jam. 1. Belajar Pembolehubah dan Jenis Data, 2.

Python digunakan secara meluas dalam bidang pembangunan web, sains data, pembelajaran mesin, automasi dan skrip. 1) Dalam pembangunan web, kerangka Django dan Flask memudahkan proses pembangunan. 2) Dalam bidang sains data dan pembelajaran mesin, numpy, panda, scikit-learn dan perpustakaan tensorflow memberikan sokongan yang kuat. 3) Dari segi automasi dan skrip, Python sesuai untuk tugas -tugas seperti ujian automatik dan pengurusan sistem.

Anda boleh mempelajari asas -asas Python dalam masa dua jam. 1. Belajar pembolehubah dan jenis data, 2. Struktur kawalan induk seperti jika pernyataan dan gelung, 3 memahami definisi dan penggunaan fungsi. Ini akan membantu anda mula menulis program python mudah.

Bagaimana Mengajar Asas Pengaturcaraan Pemula Komputer Dalam masa 10 jam? Sekiranya anda hanya mempunyai 10 jam untuk mengajar pemula komputer beberapa pengetahuan pengaturcaraan, apa yang akan anda pilih untuk mengajar ...

Cara mengelakkan dikesan semasa menggunakan fiddlerevery di mana untuk bacaan lelaki-dalam-pertengahan apabila anda menggunakan fiddlerevery di mana ...

Memuatkan Fail Pickle di Python 3.6 Kesalahan Laporan Alam Sekitar: ModulenotFoundError: Nomodulenamed ...

Bagaimana untuk menyelesaikan masalah segmentasi kata Jieba dalam analisis komen tempat yang indah? Semasa kami mengadakan komen dan analisis tempat yang indah, kami sering menggunakan alat segmentasi perkataan jieba untuk memproses teks ...

Bagaimana cara menggunakan ungkapan biasa untuk memadankan tag tertutup pertama dan berhenti? Semasa berurusan dengan HTML atau bahasa markup lain, ungkapan biasa sering diperlukan untuk ...


Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

ZendStudio 13.5.1 Mac
Persekitaran pembangunan bersepadu PHP yang berkuasa

Muat turun versi mac editor Atom
Editor sumber terbuka yang paling popular

Pelayar Peperiksaan Selamat
Pelayar Peperiksaan Selamat ialah persekitaran pelayar selamat untuk mengambil peperiksaan dalam talian dengan selamat. Perisian ini menukar mana-mana komputer menjadi stesen kerja yang selamat. Ia mengawal akses kepada mana-mana utiliti dan menghalang pelajar daripada menggunakan sumber yang tidak dibenarkan.

SublimeText3 Linux versi baharu
SublimeText3 Linux versi terkini

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan