博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
10.2 设计用户编辑资料页面
阅读量:4095 次
发布时间:2019-05-25

本文共 2132 字,大约阅读时间需要 7 分钟。

我们应该给用户提供编辑自己资料的功能。

我们来梳理一下如何实现这个功能, 首先我们应该建立一个修改用户资料的表单, 有了这个表单以后就得有一个路由来返回该表单, 如果是get请求则直接返回渲染该表单的模板; post请求修改资料, 并且返回用户资料页面;最后在用户资料页面添加一个修改资料的了解即可。

一. 添加表单|-app/-main/forms.py

from flask_wtf import FlaskFormfrom wtforms import StringField, TextAreaField, SubmitFieldfrom wtforms.validators import Lengthclass EditProfileForm(FlaskForm):    name = StringField('real name', validators=[ Length(0, 64) ])    location = StringField('locaiton', validators=[ Length(0, 64) ])    about_me = TextAreaField('about_me')    submit = SubmitField('Submit')

二. 添加返回该表单的路由|-app/-main/views.py

from . import mainfrom flask_login import login_required, current_userfrom .forms import EditProfileFormfrom .. import dbfrom flask import flash, redirect, url_for, render_template@main.route('edit_profile', methods=['GET', 'POST'])@login_requireddef edit_profile():    form = EditProfileForm()    if form.validate_on_submit():  #post请求里修改用户资料        current_user.name = form.name.data        current_user.location = form.location.data        current_user.about_me = form.about_me.data        db.session.add(current_user)        flash("Your profile has been updated.")        return redirect(url_for('main.user', username=current_user.username))    form.name.data = current_user.name  #get请求返回用户资料    form.locaiton.data = current_user.location    form.about_me = current_user.about_me    return render_template('edit_profile.html', form=form)  #edit_profile.html只需要渲染一下表单即可, 不再赘述

问:因为路由里需要改变用户的属性, 需要用到用户实例, 那么修改用户资料的链接可不可以为/edit_profile/<username>, 然后用数据库查询得到用户实例?

答:这是绝对不可以的, 如果这样的话那么任何知道修改资料页面链接的人可以修改任何用户的资料, 我们想要的却是任何用户只能修改自己的资料, 所以我们用@login_required和current_user的组合。

三. 我们在用户资料页面加一个修改用户资料的链接user.html

{% if current_user.is_authenticated() %}

Edit Profile

{% endif %}

添加判断条件的原因:

    我们之前说了我们可以把自己页面的url分享给朋友, 但是我们不希望朋友修改我们的资料, 所以user.html里应该加上这个判断条件, 如果当前用户已经登录的话, 显示修改资料的链接, 如果没有登陆, 则不显示。

    虽然如果显示连接的话, 朋友点击以后也需要登录, 不知道自己用户密码的话也修改不了自己的资料,但是该链接就会显得多余, 所以分享给朋友的时候还是不显示此链接比较好。

    当自己登录以后访问用户页面, 显示该链接就好了。

四. 效果演示

我们登录用户john:

点击Profile访问main.user视图函数:

点击Ediet Profile链接,访问main.edit_profile视图函数, 返回编辑表单:

修改资料:

点击提交按钮, 向main.edit_profile发送post请求, 修改资料重定向到用户页面:

你可能感兴趣的文章
进程的地址空间概述
查看>>
Windows 窗口底层原理
查看>>
一种函数指针的运用
查看>>
Win32程序之进程的原理
查看>>
C++虚函数原理
查看>>
MySQL的索引
查看>>
今天,Python信息量很大!
查看>>
Flash 已死,Deno 当立?
查看>>
编程差的程序员,90%都是吃了数学的亏!骨灰级开发:方法不对,努力也白费...
查看>>
编程差的程序员,90%都是吃了数学的亏!骨灰级开发:方法不对,努力也白费...
查看>>
都无代码了,还要程序员吗?
查看>>
程序员:凭自己能力吃饭,有什么理由瞧不起?
查看>>
面试想拿 10K,HR 说我只配7k?
查看>>
副业过万的程序员都知道的网站有哪些
查看>>
那些人生“开挂”的程序员,都在干什么?
查看>>
影响科学圈的那些计算机代码
查看>>
乐视视频 App 图标改为“欠 122 亿”,网友:我在别家分红包,却在你家随份子!...
查看>>
乔布斯18岁求职信拍卖价22.24万美元,值吗?
查看>>
为何程序员总喜欢写技术博客,看完恍然大悟...
查看>>
假如计算机是中国人发明的,那代码应该这么写
查看>>