当前位置: 移动技术网 > IT编程>脚本编程>Python > Flask 系列之 HelloWorld

Flask 系列之 HelloWorld

2019年03月25日  | 移动技术网IT编程  | 我要评论

死神老公好霸道,胜利油田处长被杀,白羽王种鸽

说明

  • 操作系统:windows 10
  • python 版本:3.7x
  • 虚拟环境管理器:virtualenv
  • 代码编辑器:vs code

环境搭建

打开 cmd 执行下述操作

# 创建项目文件
mkdir todolist

cd todolist

# 创建代码文件夹
mkdir app

# 创建虚拟环境
python -m virtualenv venv

# 激活虚拟环境
venv\scripts\activate

# 安装 flask
pip insatll flask

# 启动 vs code 编辑器
code .

hello world

todolist\app 目录下创建一个 init.py ,示例代码如下所示:

from flask import flask

app = flask(__name__)


@app.route('/')
@app.route('/index')
def index():
    return '<h1>hello world</h1>'

todolist 目录下创建一个 manage.py 文件,示例代码如下所示:

from app import app

if __name__ == "__main__":
    app.run(debug=true, host='0.0.0.0', host=5000)

在 vs code 的 terminal 窗口执行 python manage.py 操作,在在本地启动一个开发服务器,运行起我们的程序,等程序成功启动起来后,尝试打开浏览器访问 "http://127.0.0.1:5000/" 即可看到页面显示一个 hello world

使用 render_template

todolist\app\templates 目录下创建一个 页面,示例代码如下所示:

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>index</title>
</head>

<body>
    <h1>hello world</h1>
</body>

</html>

修改 todolist\app\__init__.py 文件,示例代码如下所示:

from flask import flask, render_template

app = flask(__name__)


@app.route('/')
@app.route('/index')
def index():
    return render_template('')

尝试打开浏览器访问 "http://127.0.0.1:5000/" 即可看到相应效果。

使用模板继承优化代码

todolist\app\templates 目录下创建一个 base.html 页面,示例代码如下所示:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>index</title>
</head>
<body>
    {% block content %}{% endblock %}
</body>
</html>

修改 todolist\app\templates\ 页面,示例代码如下所示:

{% extends 'base.html' %}

{% block content %}
<h1>hello world</h1>
{% endblock %}

尝试打开浏览器访问 "http://127.0.0.1:5000/" 即可看到相应效果。

页面传值

修改 todolist\app\__init__.py ,示例代码如下所示

from flask import flask, render_template

app = flask(__name__)


@app.route('/')
@app.route('/index')
def index():
    title = 'home'
    greet = 'hello world'
    return render_template('', title=title, greet=greet)

修改 todolist\app\templates\base.html 页面,示例代码如下所示:

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    {% if title %}
    <title>{{title}}'s todo list</title>
    {% else %}
    <title>todo list</title>
    {% endif %}
</head>

<body>
    {% block content %}{% endblock %}
</body>

</html>

修改 todolist\app\templates\ 页面,示例代码如下所示

{% extends 'base.html' %}

{% block content %}
<h1>{{greet}}</h1>
{% endblock %}

尝试打开浏览器访问 "http://127.0.0.1:5000/" 即可看到相应效果。

注意事项

若在 vs code 的虚拟环境下安装依赖包失败的的话,尝试以管理员方式打开 powershell 执行 set-executionpolicy remotesigned 即可

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网