首页 > 其他 > 详细

Flask 系列之 HelloWorld

时间:2019-03-24 22:35:57      阅读:133      评论:0      收藏:0      [点我收藏+]

技术分享图片

说明

  • 操作系统: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 目录下创建一个 index.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>
    <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('index.html')

尝试打开浏览器访问 "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\index.html 页面,示例代码如下所示:

{% 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('index.html', 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\index.html 页面,示例代码如下所示

{% extends 'base.html' %}

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

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

注意事项

若在 VS Code 的虚拟环境下安装依赖包失败的的话,尝试以管理员方式打开 powershell 执行 Set-ExecutionPolicy RemoteSigned 即可

Flask 系列之 HelloWorld

原文:https://www.cnblogs.com/hippieZhou/p/10273258.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!