期末作品检查

期末作品检查：基本要求
1. 检查时间：18最后四节课，上课之前必须全部完成，上课做基本部署就开始检查
2. 方式：逐个运行演示，抽查代码
3. 主题：选一个主题，整个网站风格统一，布局合理，尽量美观。
期末作品检查：必须完成：
1. 网站父模板统一布局：头部导航条、底部图片导航、中间主显示区域布局
2. 注册、登录、注销
3. 发布、列表显示
4. 详情页
5. 评论、列表显示
6. 个人中心
7. 搜索，条件组合搜索
8. 一篇完整的博客
  1. 个人学期总结
  2. 总结Python+Flask+MysqL的web建设技术过程，标准如下：
    1. 即是对自己所学知识的梳理
    2. 也可作为初学入门者的简单教程
    3. 也可作为自己以后复习的向导
    4. 也是一种向外展示能力的途径
期末作品检查：加分功能
1. 文章分类、显示
2. 点赞、收藏
3. 修改密码、头像、上传头像
4. 我的
5. 高级搜索

前言及前期准备：在学习这门课的时候运用到了python，flask，mysql，render_template，request,redirect,url_for,session，SQLAlchemy，flask_sqlalchemy，来进行web的构建，此过程一定确保安装成功。

系统软件：pycharm，navicat，内网址填入localhost，外网域名根据自己喜欢的名字填写，因此，建立自己网站的数据库名，才能访问创建的该页面

前期工作：分别写网页所需要的html文件,再而从py文件，建立相应的数据库传到网页，若需要装饰器，还要定义装饰器，这个装饰器的作用就是将地址与方法名联系起来，当HTTP请求的url时候将调用方法进行处理。也就是建立了url与处理函数的映射。

前端实现：

登陆：

{% extends'base.html' %}
{% block title %}登陆{% endblock %}

{% block head %}
    <link href="https:maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"rel="stylesheet">
    <link href="{{ url_for('static',filename='css/login.css') }}" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/base.css') }}">
    <script src="{{ url_for('static',filename='js/login.js') }}"></script>
    <script src="{{ url_for('static',filename='js/base.js') }}"></script>
{% endblock %}

{% block main %}
<div class="box">
    <h2 style="text-align: center">登录</h2>
    <form action="{{url_for('login')}}" method="post">
    <div class="input_box">
        <input id="uname" type="text" placeholder="请输入用户名" name="username" style="width:300px;height:20px">
    </div>
    <div class="input_box">
        <input id="upass" type="password" placeholder="请输入密码" name="password" style="width:300px;height:20px">
    </div>
    <br>
    <div id="error_box"><br></div>
    <div class="input_box">
        <button onclick="return fnLogin()">登陆</button><br>
  　　　<a class="link-forget cl-link-blue"href="{{ url_for('regist') }}" >忘记密码</a>
        <a class="link-forget cl-link-blue"href="{{ url_for('regist') }}">注册</a>
    </div>
        </form>
</div>

{% endblock %}

注册：

{% extends'base.html' %}
{% block title %}注册{% endblock %}

{% block head %}
    <link href="https:maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"rel="stylesheet">
    <link href="{{ url_for('static',filename='css/login.css') }}" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/base.css') }}">
    <script src="{{ url_for('static',filename='js/regist.js') }}"></script>
     <script src="{{ url_for('static',filename='js/base.js') }}"></script>
{% endblock %}

{% block main %}
<div class="box">
   <h2 style="text-align: center">注册</h2>
    <form action="{{url_for('regist')}}" method="post">
    <div class="input_box">
        <input id="uname" type="text" placeholder="请输入用户名" name="username" style="width:300px;height:20px">
    </div>
    <div class="input_box">
        <input id="upass" type="password" placeholder="请输入密码" name="password" style="width:300px;height:20px"><br>
        <input id="upass1" type="password" placeholder="请重复输入密码" style="width:300px;height:20px">
    </div>
    <div class="input_box">
        <input id="nname" type="text" placeholder="请输入昵称" name="nickname" style="width:300px;height:20px">
    </div>
    <br>
    <div id="error_box"><br></div>
    <div class="input_box">
        <button onclick="return fnRegist()">注册</button><br>
    </div>
        </form>
</div>
{% endblock %}

首页和导航：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
        {% block title %}{% endblock %}
        页面
    </title>
    <style>
        p.sansserif{font-family:"Comic Sans MS", cursive, sans-serif}
    </style>
    {% block head %}
 <!--引入bootstrap-->
    <link href="https:maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/base.css') }}">
    <script src="{{ url_for('static',filename='js/base.js') }}"></script>
    <link rel="stylesheet" type="text/css" href="../static/css/tu.css">
{% endblock %}

</head>

<body id="myBody">


    <nav>
        <div class="img">
    <img src="http://img.liansuo.com/html/images/20150909/wap_14417666396022.jpg" style="width:100%;height:300px" ><br>
</div>
    <img id="myOnOff" onclick="mySwitch()" src="http://www.runoob.com/images/pic_bulbon.gif" width="25px">


    <ul class="nav nav-pills nav-justified">
    <li class="active"><a href="{{ url_for('base') }}">首页</a></li>
    <li><a href="{{ url_for('login') }}">登录</a></li>
    <li><a href="{{ url_for('regist') }}">注册</a></li>
    <li><a href="{{ url_for('ask') }}">发布问题</a></li>
    <li><a href="{{url_for('logout')}}">注销</a></li>
    </ul><br>
        <form action="{{url_for('search')}}" method="get">
        <input name="q" type="text" placeholder="请输入关键字">
        <button type="submit">搜索</button>
        </form>
    </nav>
        <div class="zy">
     {% if username %}
            <a href=""><p class="sansserif">{{ username }},欢迎你</p></a>
        <li><a href="{{url_for('logout')}}">注销</a>></li>
     {% else %}

     {% endif %}
        </div>
</nav>

{% block main %}
    <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=4221186847,2388355095&fm=27&gp=0.jpg" style="weight:100px;height:100px">
    <div>
<ul class="list-group" style="align-content: center">
    {%for foo in questions %}
        <li class="list-group-item" >
            <span class="glyphicon glyphicon-leaf"aria-hidden="true"></span>
            <a href="{{ url_for('detail',question_id=foo.id) }}" class="title">标题：{{ foo.title }}</a><br>
            <p class="detail">内容：{{ foo.detail }}</p>
            <a class="author" href="{{url_for('usercenter',user_id=foo.author_id,tag=1)}}">{{foo.author.username}}评论：({{ foo.comments|length }})</a><br>
            <span class="badge">{{foo.create_time}}</span>
        </li>
        {% endfor %}
    </ul>
    </div>
{% endblock %}


<div class="area">
</div>

<footer>
        <div class="recommend">
    <div class="img">
        <a href="http://www.sesamestreetchina.com.cn/the_show.php"><img src="http://www.chinapp.com/uploadfile/Pinpai/2015-03-13/14262282678751.jpg"></a>
        <div class="desc"><a href="http://www.sesamestreetchina.com.cn/the_show.php">芝麻街剧场</a></div>
    </div>
        </div>
<div class="footer_box">
        Copyright@2017 个人版权，版权所有　　作者：xxx
    </div>
    </footer>
</body>
</html>

相关后端的实现：

from flask import Flask,render_template,request,redirect,url_for,session
from flask_sqlalchemy import SQLAlchemy
import config
from functools import wraps
from datetime import datetime
from sqlalchemy import or_
from werkzeug.security import generate_password_hash, check_password_hash

app=Flask(__name__)
app.config.from_object(config)
db=SQLAlchemy(app)

class User(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)#内部使用
    nickname = db.Column(db.String(50))

    @property
    def password(self):  # 外部使用
        return self._password

    @password.setter
    def password(self, row_password):
        self._password = generate_password_hash(row_password)

    def check_password(self, row_password):
        result = check_password_hash(self._password, row_password)
        return result

class Question(db.Model):
    __tablename__='question'
    id=db.Column(db.Integer, primary_key=True,autoincrement=True)
    title = db.Column(db.String(100), nullable=False)
    detail = db.Column(db.Text,nullable=False)
    create_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'))

class Comment(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'))
    create_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=create_time.desc))
    author=db.relationship('User',backref=db.backref('comments'))

db.create_all()

#首页
@app.route('/')
def base():
    context={
        'questions': Question.query.order_by('-create_time').all()
    }
    return render_template('base.html',**context)

#行动前需要登录，定义装饰器
def loginFirst(func):
    @wraps(func)
    def wrapper(*args, **kwargs):
        if session.get('user'):
            return func(*args, **kwargs)
        else:
            return redirect(url_for('login'))
    return wrapper

# 详情页,默认get方法
@app.route('/detail/<question_id>')
def detail(question_id):
    quest=Question.query.filter(Question.id==question_id).first()
    return render_template('detail.html',ques=quest)

@app.route('/comment/', methods=['POST'])
@loginFirst
def comment():
    comment=request.form.get('new_comment')
    ques_id=request.form.get('question_id')
    auth_id=User.query.filter(User.username==session.get('user')).first().id
    comm=Comment(author_id=auth_id,question_id=ques_id,detail=comment)
    db.session.add(comm)
    db.session.commit()
    return redirect(url_for('detail',question_id=ques_id))

@app.route('/usercenter/<user_id>/<tag>')
@loginFirst
def usercenter(user_id,tag):
    user = User.query.filter(User.id == user_id).first()
    context={
        'user':user,
        'username':user.username,
        'questions':user.question,
        'comments':user.comments,
    }
    if tag =='1':
        return render_template('usercenter1.html',**context)
    elif tag =='2':
        return render_template('usercenter2.html',**context)
    else:
        return render_template('usercenter3.html',**context)

@app.route('/login/',methods=['GET','POST'])
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).first()
        if user:
            if user.check_password(password):
                session['user'] = username
                session.permannet = True
                return redirect(url_for('base'))
            else:
                return '密码错误'
        else:
           return '用户名不存在'

# 注销
@app.route('/logout/')
def logout():
    session.clear()
    return redirect(url_for('base'))

@app.route('/regist/', methods=['GET', 'POST'])
def regist():
    if request.method == 'GET':
        return render_template("regist.html")
    else:
        username = request.form.get('username')
        password = request.form.get('password')
        nickname = request.form.get('nickname')
        user = User.query.filter(User.username == username).first()
        if user:
            return u'用户名已存在'
        else:
            user = User(username=username, password=password, nickname=nickname)
            db.session.add(user)  # 数据库，添加操作
            db.session.commit()
            return redirect(url_for('login'))

@app.context_processor
def mycontext():
    username = session.get('user')
    if username:
        return {'username': username}
    else:
        return {}

@app.route('/ask/',methods=['GET','POST'])
@loginFirst
def ask():
    if request.method=='GET':
        return render_template('ask.html')
    else:
        title= request.form.get('title')
        detail = request.form.get('detail')
        author_id = User.query.filter(User.username == session.get('user')).first().id#判断用户是否存在
        question = Question(title=title, detail=detail, author_id=author_id)
        db.session.add(question)# 保存到数据库
        db.session.commit()# 提交
        return redirect(url_for('base'))# 跳转

@app.route('/search/')
def search():
    qu=request.args.get('q')
    ques=Question.query.filter(
        or_(
            Question.title.contains(qu),
            Question.detail.contains(qu)
        )
     ).order_by('-create_time')
    return render_template('base.html',questions=ques)

if __name__=='__main__':
    app.run()

涉及到的相关步骤内容：

HTTP请求发送到后端与响应的过程
Flask
Flask的常用工具和项目配置
pycharm
HTTP requester
从第一个路由注册接口开始
使用装饰器处理接口必填字段
Flask上下文获取request参数
数据库连接
循环引用

总结：

这边总结是经过一学期学习了相关基础的实践总结，虽然内容比较的简单，自己的知识有限，但还是学习到了不少新知识，对于python语言的入门，相关内容只是比之前学习的java等语言编写代码更加的简单，总之对于这学期的学习还是有所收获的.

posted @ 2018-01-05 08:44 007杨碧茜阅读(227) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

期末作品检查

公告