zoukankan      html  css  js  c++  java
  • python flask 小项目

    0 开始之前

    网上看了很多教程,都不是很满意,因此自己写一个大型教程,从入门到做出一个比较完整的博客。此次教程不是直接把整个博客直接代码整理出来然后运行一遍就完事,我会从flask的各个模块讲起。所以,如果你没有接触过flask,按照整个教程完整做一遍会掌握flask。(前提是你要有一定Python和web基础)

    1 Hello world !

    如果你接触过任何编程语言,对这个小标题都会很熟悉,此次对flask的学习也是从这个小例子开始。

    准备工作环境

    duke@coding:~$ mkdir flask_tutorial

    duke@coding:~$ cd flask_tutorial/

    duke@coding:~/flask_tutorial$ virtualenv --no-site-package venv
    Using base prefix '/home/duke/.pyenv/versions/3.6.4'
    New python executable in /home/duke/flask_tutorial/venv/bin/python3.6
    Also creating executable in /home/duke/flask_tutorial/venv/bin/python
    Installing setuptools, pip, wheel...done.

    duke@coding:~/flask_tutorial$ source venv/bin/activate
    #进入Python虚拟环境
    (venv) duke@coding:~/flask_tutorial$
    (venv) duke@coding:~/flask_tutorial$ pip install flask
    #创建flask目录
    (venv) duke@coding:~/flask_tutorial$ mkdir flask

    (venv) duke@coding:~/flask_tutorial$ cd flask/

    (venv) duke@coding:~/flask_tutorial/flask$1234567891011121314151617181920

    正式开始

    (venv) duke@coding:~/flask_tutorial/flask$ mkdir app

    (venv) duke@coding:~/flask_tutorial/flask$ cd app/
    #创建初始化文件
    (venv) duke@coding:~/flask_tutorial/flask/app$ touch __init__.py12345

    在_ _ init _ _.py中写如下代码,你可以使用pycharm,vscode等IDE来更快的书写代码。

    app/_ _ init _ _.py : 项目初始化

    from flask import Flask
    #创建app应用,__name__是python预定义变量,被设置为使用本模块.
    app = Flask(__name__)
    #如果你使用的IDE,在routes这里会报错,因为我们还没有创建呀,为了一会不要再回来写一遍,因此我先写上了
    from app import routes12345

    创建路由模块,你可以使用IDE直接新建,没有必要要使用命令行创建

    (venv) duke@coding:~/flask_tutorial/flask/app$ touch routes.py1

    app/routes.py : 主页路由

    #从app模块中即从__init__.py中导入创建的app应用
    from app import app

    #建立路由,通过路由可以执行其覆盖的方法,可以多个路由指向同一个方法。
    @app.route('/')
    @app.route('/index')
    def index():
    return "Hello,World!"12345678

    现在基本都齐全了,但是我们还是需要在app模块之外创建一个主入口,即执行这个主入口就可以达成运行整个项目的目的。

    (venv) duke@coding:~/flask_tutorial/flask/app$ cd ..
    (venv) duke@coding:~/flask_tutorial/flask$ touch myblog.py12

    myblog.py : 项目入口

    #从app模块中导入app应用
    from app import app

    #防止被引用后执行,只有在当前模块中才可以使用
    if __name__=='__main__':
    app.run()123456

    现在整个小demo就完成了,结构应该是这样的

    flask
    ├── app
    │ ├── __init__.py
    │ └── routes.py
    └── myblog.py12345

    ok,接下来就让项目跑起来

    (venv) duke@coding:~/flask_tutorial/flask$ export FLASK_APP=myblog.py

    (venv) duke@coding:~/flask_tutorial/flask$ flask run
    * Serving Flask app "myblog.py"
    * Environment: production
    WARNING: Do not use the development server in a production environment.
    Use a production WSGI server instead.
    * Debug mode: off
    * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
    12345678910

    在浏览器里输入http://127.0.0.1:5000/ 或者 http://127.0.0.1:5000/index 都可以访问你的项目啦!

    2 模板

    在1里,我们完成了一个返回值的显示,但这肯定远远不能满足我们需求的。因为我们希望看到的是丰富多彩的网页呀~,有什么办法呢?上一步咱们返回了一个值,那咱们返回一个网页会怎么样呢?

    app/routes.py : 返回一个网页

    from app import app

    @app.route('/')
    @app.route('/index')
    def index():
    user = {'username':'duke'}
    html = '''
    <html>
    <head>
    <title>Home Page - Microblog</title>
    </head>
    <body>
    <h1>Hello, ''' + user['username'] + '''!</h1>
    </body>
    </html>

    '''
    return html123456789101112131415161718


    如图所示,这样就完成了返回网页的目的,但是这样实在是太麻烦了,因此肯定有解决这个问题的办法喽。对,模板就是解决这个问题的办法。

    (venv) duke@coding:~/flask_tutorial/flask$ mkdir app/templates
    #在新建的templates中新建一个index.html
    (venv) duke@coding:~/flask_tutorial/flask/app/templates$ touch index.html123

    app/templates/index.html : 主页模板,将数据显示在其中

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>{{ title }} - 博客</title>
    </head>
    <body>
    <h1> Hello ,{{ user.username }} !</h1>
    </body>
    </html>12345678910

    这里出现{{ }} 意味着变量,可以接受数据的地方。既然在这里写了变量,那么就要在路由中修改对应的格式,因为要把数据返回才可以。

    app/routes.py : 将写在路由中的html删除,并增加一些变量。

    #导入模板模块
    from flask import render_template
    from app import app

    @app.route('/')
    @app.route('/index')
    def index():
    user = {'username':'duke'}
    #将需要展示的数据传递给模板进行显示
    return render_template('index.html',title='我的',user=user)12345678910

    从新运行后,效果还是符合预期的。但是,如果你传递至模板的数据是空的,那页面显示岂不是很难看?因此我们需要在模板中加上一些判断,看数据是否为空。

    app/templates/index.html : 主页模板,完善模板

    <!DOCTYPE html>
    <html >
    <head>
    <meta charset="UTF-8">
    {% if title %}
    <title>{{ title }} - 博客</title>
    {% else %}
    <title>欢迎来到博客!</title>
    {% endif %}
    </head>
    <body>
    <h1>Hello, {{ user.username }}!</h1>
    </body>
    </html>1234567891011121314

    如果传进来的数据很多,那么就可以使用循环来展示数据。首先,还是对路由里的方法进行修改。

    app/routes.py : 增加一些数据

    from flask import render_template
    from app import app

    @app.route('/')
    @app.route('/index')
    def index():
    user = {'username':'duke'}
    posts = [
    {
    'author':{'username':'刘'},
    'body':'这是模板模块中的循环例子~1'

    },
    {
    'author': {'username': '忠强'},
    'body': '这是模板模块中的循环例子~2'
    }
    ]
    return render_template('index.html',title='我的',user=user,posts=posts)12345678910111213141516171819

    增加了这些数据之后要对模板中的结构进行一些修改。

    app/templates/index.html : 循环展示数据

    <!DOCTYPE html>
    <html >
    <head>
    <meta charset="UTF-8">
    {% if title %}
    <title>{{ title }} - 博客</title>
    {% else %}
    <title>欢迎来到博客!</title>
    {% endif %}
    </head>
    <body>
    <h1>你好呀, {{ user.username }} !</h1>
    {% for post in posts %}
    <div><p>{{ post.author.username }} 说:<b>{{ post.body }}</b></p></div>
    {% endfor %}

    </body>
    </html>123456789101112131415161718


    我们发现,每次修改页面都是要有很多重复的不必要代码,因此把重复的代码放到一个基类模板里,在里面留上占位符,这样只需要修改其中一部分就可以了,十分方便。

    创建一个基类模板

    (venv) duke@coding:~/flask_tutorial/flask/app/templates$ touch base.html1

    app/templates/base.html : 填充内容

    <!DOCTYPE html>
    <html >
    <head>
    <meta charset="UTF-8">
    {% if title %}
    <title>{{ title }} - 博客</title>
    {% else %}
    <title>欢迎来到博客!</title>
    {% endif %}
    </head>
    <body>
    <div>博客 : <a href="/index">首页</a></div>
    {% block content %}

    {% endblock %}
    </body>
    </html>1234567891011121314151617

    那么这有什么作用呢?注意这里面有{% block content %} {% endblock %}这一对标签,因此其他页面只需要继承这个页面,然后写上相同的标签,在标签内写上内容,就可以完整的在页面上显示所有内容。既然有了基类模板,那么index.html显示就不需要那么多代码了,这里对index.html进行修改。

    app/templates/index.html : 修改格式和内容

    {% extends 'base.html' %}

    {% block content %}

    <h1>你好呀, {{ user.username }} !</h1>

    {% for post in posts %}
    <div><p>{{ post.author.username }} 说:<b>{{ post.body }}</b></p></div>
    {% endfor %}


    {% endblock %}
    ---------------------

  • 相关阅读:
    Java实现 蓝桥杯 算法提高 特等奖学金(暴力)
    Java实现 蓝桥杯 算法提高 特等奖学金(暴力)
    Java实现 蓝桥杯 算法提高 GPA(暴力)
    Java实现 蓝桥杯 算法提高 GPA(暴力)
    Java实现 蓝桥杯 算法提高 GPA(暴力)
    Java实现 蓝桥杯 算法提高 套正方形(暴力)
    Java实现 蓝桥杯 算法提高 套正方形(暴力)
    第一届云原生应用大赛火热报名中! helm install “一键安装”应用触手可及!
    云原生时代,2个方案轻松加速百万级镜像
    Knative 基本功能深入剖析:Knative Serving 自动扩缩容 Autoscaler
  • 原文地址:https://www.cnblogs.com/duanlinxiao/p/9836095.html
Copyright © 2011-2022 走看看