python个人网站开发_python+flask开发属于自己的个人轻量级web服务网站(十七）

登陆页面和注册页面的搭建

还是跟导航条的制作一样，我们的登录页面和注册页面也是在bootstrap上寻找模板。

我们在bootstrap上全局CSS样式寻找到可用的表单：

5.png

copy下这个样式的代码

然后进行一些小的细微的调整

{% extends 'base.html' %}

{% block title %}登录{% endblock %}

{% block head %}

{% endblock %}

{% block main %}

登录

登录

{% endblock %}

登录页面如下：

6.png

接下来制作注册页面，注册页面与登陆页面类似：

{% extends 'base.html' %}

{% block title %}注册{% endblock %}

{% block head %}

{% endblock %}

{% block main %}

注册

注册

{% endblock %}

注册页面的效果：

7.png

这样前端页面的制作基本完成了，接下来进行将前台页面与数据库相连的操作：

login和register页面的视图函数如下：

def login():

if request.method=='GET':

return render_template('login.html')

else:

username = request.form.get('username')

password = request.form.get('password')

user = User.query.filter(User.username == username,User.password==password).first()

if user:

session['userid']=user.id

session.permanent=True

return redirect(url_for('index'))

else:

return "用户名或密码错误！"

@app.route('/register/',methods=['GET','POST'])

def register():

if request.method=='GET':

return render_template('register.html')

else:

username = request.form.get('username')

password1 = request.form.get('password1')

password2 = request.form.get('password2')

user = User.query.filter(User.username==username).first()

#判断注册的用户名是否重复

if user:

return "该用户名已被使用，请重新注册！"

#判断两次输入的密码是否一样

else:

if password1 != password2:

return "两次输入的密码不一致！"

else:

user = User(username=username,password = password1)

db.session.add(user)

db.session.commit()

#注册成功后，自动跳转到登陆页面(重定向)

return redirect(url_for('login'))

效果展示：

jianshu.gif