在这个信息技术发展飞快的时代,信息也不再是像从前那么单一,具体的形式来存在的,所以我们对于信息也不能以以前的态度去面对,我们要有更好的方法去管理信息,利用Python+Flask+MysqL和HTML+CSS去制作一个属于自己的网站,把信息进行统一的管理,才会跟上时代,不断进步。
该文档目的在于明确系统的总体网页结构设计和相应的算法及数据结构,设计外部软件和内部软件的接口,说明各个网站模块的功能实现,网页间后台代码的实现,数据结构的细节等。
要求实现以下功能:
a)网站父模板统一布局:头部导航条、底部图片导航、中间主显示区域布局
c)发布、列表显示
d)详情页
f)个人中心
g)搜索,条件组合搜索
i)点赞、收藏
j)修改密码、头像、上传头像
l)高级搜索
软件系统的总体逻辑结构,按照不同的设计方法,有不同的总体逻辑结构。本指南以结构化设计方法为主,画出系统总体结构图,列出系统的功能模块清单编号、名称、功能,并尽可能描绘出功能模块之间的关系。数据库概念设计最常用的方法是以实体-联系方法,该方法是用E-R图来描述,它可以很清晰地表示出实体之间的关系,网页系统涉及了用户表、问题表、内容表、收藏表、热文表等三个数据库。其E-R图如图2.1--图2.6所示。
用户表
图2-1
问题表
图2-2
内容表
图2-3
图2-4
收藏表
图2-5
总体数据库如2-6所示
图2-6
软件系统的总体逻辑结构,按照不同的设计方法,有不同的总体逻辑结构。本指南以结构化设计方法为主,画出系统总体结构图,列出系统的功能模块清单名称、功能、效果,并尽可能描绘出功能模块之间的关系。关于总体结构图明如图3-1所示
图3-1
a)Python环境变量配置
程序和可执行文件可以在许多目录,而这些路径很可能不在操作系统提供可执行文件的搜索路径中。path(路径)存储在环境变量中,这是由操作系统维护的一个命名的字符串。这些变量包含可用的命令行解释器和其他程序的信息。把安装好的python路径置于环境变量中。进行这一步时需要特别注意的是路径copy的路径是否是正确,以免在终端窗口输入时,总是显示:不是内部或外部文件,这个是许多人会犯的错误。C:\Python是Python的安装目录。可以通过以下方式设置:
b)运行Python
我是通过命令行窗口进入python并开在交互式解释器中开始编写Python代码。
c)集成开发环境:PyCharm
该系统的实现主要是以每个模块赖设计的,模块与模块之间的详细设计是有相联系的,写模块之前要进行后台一些包的导入和数据库的设置、本系统有三个表需要在后端进行展示。而模块详情划主要分为12个模块,设计的核心代码如下所示:
(1)包的导入与数据库设置
包的导入:
数据库的设置:
1、用户表
classUser(db.Model):__tablename__='user'id=db.Column(db.Integer,primary_key=True,autoincrement=True)username=db.Column(db.String(20),nullable=False)_password=db.Column(db.String(200),nullable=False)#密码加密内部使用user_image=db.Column(db.String(252),nullable=True,default=None)
@property#定义函数,需要用属性时可以用函数代替defpassword(self):#外部使用returnself._password@password.setterdefpassword(self,row_password):#密码进来时进行加密,generate_password_hash是一个密码加盐哈希函数,生成的哈希值可通过check_password_hash()进行验证。self._password=generate_password_hash(row_password)defcheck_password(self,row_password):#check_password_hash函数用于验证经过generate_password_hash哈希的密码。若密码匹配,则返回真,否则返回假。result=check_password_hash(self._password,row_password)returnresult
2、问答表classQuestion(db.Model):__tablename__='question'id=db.Column(db.Integer,primary_key=True,autoincrement=True)fenlei=db.Column(db.String(100),nullable=False)title=db.Column(db.String(100),nullable=False)detail=db.Column(db.Text,nullable=False)creat_time=db.Column(db.DateTime,default=datetime.now)author_id=db.Column(db.Integer,db.ForeignKey('user.id'))author=db.relationship('User',backref=db.backref('question'))#问答对象的创建
3、内容表classComment(db.Model):__tablename__='comment'id=db.Column(db.Integer,primary_key=True,autoincrement=True)author_id=db.Column(db.Integer,db.ForeignKey('user.id'))question_id=db.Column(db.Integer,db.ForeignKey('question.id'))creat_time=db.Column(db.DateTime,default=datetime.now)detail=db.Column(db.Text,nullable=False)question=db.relationship('Question',backref=db.backref('comments',order_by=creat_time.desc))author=db.relationship('User',backref=db.backref('comments'))
4、收藏表
(2)父模板前端核心代码:顶部导航栏、中间模块和底部导航栏
父模板后端代码:
@app.route('/')defbase():returnrender_template('base.html')
首页前端核心代码:
首页后端核心代码:
@app.route('/shouye/')defshouye():context={'questions':Question.query.order_by('-creat_time').all()}returnrender_template('shouye.html',**context)
(4)注册页前端核心代码:给用户提供注册,输入有效的用户名,即用户名为6-12位,只能是字母与数字,首位不能是数字。密码须为6-20位。可成功注册并把数据存储到数据库当中,若失败则会出现相应的提示。
注册页后端核心代码:
@app.route('/regist/',methods=['GET','POST'])#methods定义它有两种请求方式,因为它在表单的请求是post,类似我们在idea中的sava请求模式defregist():ifrequest.method=='GET':returnrender_template('regist.html')else:username=request.form.get('username')#post请求模式,安排对象接收数据password=request.form.get('password')user=User.query.filter(User.username==username).first()#作查询,并判断ifuser:return'usernameexisted'else:user=User(username=username,password=password)#将对象接收的数据赋到User类中,即存到数据库db.session.add(user)#执行操作db.session.commit()returnredirect(url_for('login'))#redirect重定向
@app.route('/login/',methods=['GET','POST'])#methods定义它有两种请求方式deflogin():ifrequest.method=='GET':returnrender_template('login.html')else:usern=request.form.get('username')#post请求模式,安排对象接收数据passw=request.form.get('password')user=User.query.filter(User.username==usern).first()#作查询,并判断ifuser:#判断用户名ifuser.check_password(passw):#判断密码session['user']=usern#利用session添加传回来的值usernamesession['userid']=user.idsession.permannet=Truereturnredirect(url_for('shouye'))else:return'密码错误'else:return'用户名不存在,请先注册'
用户详情页后端核心代码:为了把页面分开,我们在html页面传了一个tag参数,根据tag的不同去到不同页面,一个请求跳转3个不同页面。
@app.route('/usercenter/
(7)问题中心页
(9)个人详情页
(10)问答详情页前端核心代码:
问答详情页后端核心代码:
(12)修改密码前端核心代码:为了用户账号安全起见,本系统为此设置了修改密码功能,对旧的密码进行重新设置。
修改密码后端核心代码:
@app.route('/edit_password/',methods=['GET','POST'])defedit_password():ifrequest.method=='GET':returnrender_template("edit_password.html")else:newpassword=request.form.get('password')user=User.query.filter(User.id==session.get('userid')).first()user.password=newpassworddb.session.commit()returnredirect(url_for('shouye'))
(13)组合条件搜索前端核心代码:在搜索框中输入你需要的关键词同时在另一个分类的下拉列表选择你需要的类型即可查询到结果。
组合条件搜索后端核心代码:
@app.route('/search/')defsearch():qu=request.args.get('q')#args获取关s键字,区别formfenlei=request.args.get('fenlei')ques=Question.query.filter(and_(#两种查询条件Question.title.contains(qu),#通过模糊查询,查找问题的标题Question.detail.contains(qu),#通过模糊查询,查找问题的详细内容Question.fenlei.contains(fenlei))).order_by('-creat_time')returnrender_template('shouye.html',questions=ques)#question要和原首页数据模型一样
(16)上传头像前端核心代码:在用户表中定义一个用户头像的直,后台写上传头像函数,从后台传值到前端页面,新建一个upload文件放上传头像的文件。
上传头像后端核心代码:@app.route('/uploadLogo/
(17)高级搜索:利用模糊搜索进行设置
@app.route('/search')defsearch():qu=request.args.get('q')c=''ifrequest.args.get('c')==''elserequest.args.get('c')y=''ifrequest.args.get('y')==''elserequest.args.get('y')query=Question.query.filter(or_(Question.title.contains(qu),Question.detail.contains(qu),),Question.cf.like('%'+c+'%'),Question.creat_time.like('%'+y+'%'),).order_by('-creat_time').all()context={'questions':query,'cf':Cf.query.all(),'hot':Question.query.order_by('-click').all()[0:5]}returnrender_template('shouye.html',**context)
收藏功能后端核心代码:
Collection=db.Table(
'collection',
db.Column('id',db.Integer,primary_key=True,autoincrement=True),
db.Column('collection',db.Integer,db.ForeignKey('user.id')),#收藏用户的id
@app.route('/remen/',methods=['GET','POST'])defremen():question=Question.query.all()returnrender_template('remen.html',question=question)
逻辑结构设计阶段的任务是将概念结构设计阶段所得到的概念模型转换为具体DBMS所能支持的数据模型(即逻辑结构),并对其进行优化。逻辑结构设计一般分为三步进行:
(1)将概念结构转换为一般的关系、网状、层次模型;
(2)将转换的关系、网状、层次模型向特定的DBMS支持下的数据模型转换;
(3)对数据模型进行优化;如下图所示:
数据结构
数据项
类型
长度
备注
id
int
11
主键
username
varchar
20
_password
200
User_image
252
发布问题表
fenlei
100
title
detail
text
0
creat_time
datetime
author
内容详情表
author_id
question_id
User_id
collection
creatdate
密码:是以加密的形式存放的于数据库。
注册:所有人要浏览本网站前都要注册一个属于自己的账号。
修改密码:可以重新设置新的密码来保护自己的账号。
上传头像:用户可以根据自己的喜好改变自己头像并储存和展示在页面当中,还保存在数据库中。
高级搜索:采用模糊查询方式进行设置。
①父模版(base.html)
②首页(shouye.html)
③注册页(regist.html)
⑤用户详情页(usercenter.html)
⑥发布详情页(xiangqing.html)
⑦问题发布页(question.html)
⑨个人信息(usercenter3.html)
⑩修改密码(edit_password.html)
组合搜索:在下拉列表框中选择“男明星”选项,同时在搜索框中查找“李”字,会出现相应的我发表过的男明星为李易峰的相应内容出现
点赞功能
上传头像功能
上传完成后,会出现相应的文件和头像:
[2]朱利安·丹乔.Python高手之路[J].法国,2016-07-15
[3]赫特兰(MagnusLieHetland)﹒Python基础教程[J]﹒北京:人民邮电出版社,2010-07-01