flask web 01--基础入门案例

最新推荐文章于 2024-05-21 09:00:00 发布
最新推荐文章于 2024-05-21 09:00:00 发布
阅读量291 收藏 1
点赞数
分类专栏： Python 文章标签： flask html python web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011127242/article/details/120714313
版权
该博客介绍了如何利用Python的Flask框架创建一个基础的Web应用，展示包括输出信息、加载数据、添加数据等功能。通过模拟数据而非实际数据库操作，实现了页面的交互。案例包含hello、get_item、list_item和add_item四个功能，涉及HTML模板的使用，以及GET和POST请求的处理。
摘要由CSDN通过智能技术生成

flask web 01--基础入门案例

1 介绍

最近由于需要，开始补了一些python web相关的技能，考虑到高效和简洁，就补了一些flask web开发的基础知识。此处为一个简单的案例，主要结合Flask 和 html，实现了一些基础的数据查询和添加。为了减少代码量，此处就模拟了一些数据，并未使用实际的db的增删查改。
即便案例很简单，也分享在此处，以便于自己和有需要的读者查阅！

2 功能说明

本案例主要包括输出hello信息、加载单条数据、按表加载数据、添加数据等4个小功能。其对应的代码结构如下所示：

├── app.py
└── templates
    ├── add_item.html  添加数据
    ├── get_item.html  加载数据
    ├── hello.html     显示传入的参数
    └── list_item.html 列举数据

3 源码分析

3.1 功能

main() 充当菜单功能；
hello(name=None) 输出hello world 或者 hello ${name};
get_item(name=None) 获取 name=${name} 的数据，此处直接模拟一条数据，实际中需要在db中查数据；
list_item() 获取数据并输出表格中，此处模拟了两条数据，实际汇总需要在db中查找；
add_item() 添加条数据，实际中拿到post的数据后还需要将其insert到db中；

3.2 源码

vim app.py

#!/usr/bin/python3 

import datetime
import json

from flask import Flask
from flask import render_template
from flask import request, redirect

app = Flask(__name__)


@app.route('/')
def main():
    ret = {
        "function": "hello, main page!",
        "/add_item/": "add an alert",
        "/list_item/": "list all alerts",
        "/get_item/[item_name]": "get an alert",
        "/hello/[name]": "say hello",
    }
    return json.dumps(ret)


@app.route('/hello/')
@app.route('/hello/<name>')
def hello(name=None):
    return render_template('hello.html', name=name)


@app.route('/get_item/')
@app.route('/get_item/<name>')
def get_item(name=None):
    # function: get an item from db
    post_data = {
        "deploy_name": "test014",
        "search_condition": "search_condition",
        "search_time_from": "now-5m",
        "search_step": "60",
        "resend_period": "30m",
        "threshold": "5"
    }
    date_time = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')
    post_data['date_time'] = date_time
    return render_template("get_item.html", post=post_data)


@app.route('/list_item/')
def list_item():
    date_time = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')
    # function: get all items from db
    post_data = [
        {
            "deploy_name": "test014",
            "search_condition": "test014 search_condition",
            "search_time_from": "now-5m",
            "search_step": "60",
            "resend_period": "30m",
            "threshold": "5"
        },
        {
            "deploy_name": "elk-001",
            "search_condition": "[{\"wildcard\":{\"hostname.keyword\":{\"value\":\"elk-001-*\"}}},"
                                "{\"term\":{\"level.keyword\":{\"value\":\"ERROR\"}}},{\"range\":{\"timestamp\":"
                                "{\"gte\":\"now-1m\",\"lte\":\"now\"}}}]",
            "search_time_from": "now-5m",
            "search_step": "60",
            "resend_period": "30m",
            "threshold": "5"
        }
    ]

    return render_template("list_item.html", posts={'data': post_data, 'date_time': date_time})


@app.route('/add_item/', methods=['GET', 'POST'])
def add_item():
    if request.method == "GET":
        # function: get an item from db
        post_data = {
            "deploy_name": "test014",
            "search_condition": "search_condition",
            "search_time_from": "now-5m",
            "search_step": "60",
            "resend_period": "30m",
            "threshold": "5"
        }
        date_time = datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')
        post_data['date_time'] = date_time
        return render_template("add_item.html", post=post_data)

    if request.method == "POST":
        post_data = {
            "deploy_name": request.form['deploy_name'],
            "search_condition": request.form["search_condition"],
            "search_time_from": request.form["search_time_from"],
            "search_step": request.form["search_step"],
            "resend_period": request.form["resend_period"],
            "threshold": request.form["threshold"]
        }
        # function: save data to db
        return json.dumps(post_data)


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

vim add_item.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, add_item</title>
</head>
<body>

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr>
        <td align="center" class="biaoti" height="60">新增日志告警</td>
    </tr>
    <tr>
        <td align="right" height="25">当前时间: {{ post['date_time'] }}</td>
    </tr>
</table>

<form method="post">
<table  width="100%" border="0" cellspacing="1" cellpadding="4" bgcolor="#f5f5dc" align="center">
    <tr>
        <td align="left" width="15%">告警参数</td>
        <td align="left">内容</td>
    </tr>
    <tr>
        <td align="left" height="25">deploy_name </td>
        <td align="left" height="25"> <input type="text" name="deploy_name" value="{{ post['deploy_name'] }}">  </td>
    </tr>
    <tr>
        <td align="left" height="25">search_condition </td>
        <td align="left" height="25"> <input type="text" name="search_condition" value="{{ post['search_condition'] }}"> </td>
    </tr>
    <tr>
        <td align="left" height="25">search_time_from </td>
        <td align="left" height="25"><input type="text" name="search_time_from" value="{{ post['search_time_from'] }}"> </td>
    </tr>
    <tr>
        <td align="left" height="25">search_step </td>
        <td align="left" height="25"><input type="text" name="search_step" value="{{ post['search_step'] }}"> </td>
    </tr>
    <tr>
        <td align="left" height="25">resend_period </td>
        <td align="left" height="25"><input type="text" name="resend_period" value="{{ post['resend_period'] }}"> </td>
    </tr>
    <tr>
        <td align="left" height="25">threshold </td>
        <td align="left" height="25"><input type="text" name="threshold" value="{{ post['threshold'] }}"> </td>
    </tr>
</table>
<table  width="100%" border="0" cellspacing="1" cellpadding="4" align="center">
    <tr>
        <td align="left" width="15%"><input name="add" type="submit" value="添加"></td>
    </tr>
</table>
</form>

<form method="get">
    <table  width="100%" border="0" cellspacing="1" cellpadding="4" align="center">
        <tr>
            <td align="left"><input name="refresh" type="submit" value="刷新"></td>
        </tr>
    </table>
</form>
</body>
</html>

vim get_item.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, get_item</title>
</head>
<body>

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr>
        <td align="center" class="biaoti" height="60">查看日志告警</td>
    </tr>
    <tr>
        <td align="right" height="25">当前时间: {{ post['date_time'] }}</td>
    </tr>
</table>

<table  width="100%" border="0" cellspacing="1" cellpadding="4" bgcolor="#f5f5dc" align="center">
    <tr>
        <td align="left" width="15%">告警参数</td>
        <td align="left">内容</td>
    </tr>
    <tr>
        <td align="left" height="25">deploy_name </td>
        <td align="left" height="25"> {{ post['deploy_name'] }} </td>
    </tr>
    <tr>
        <td align="left" height="25">search_condition </td>
        <td align="left" height="25">{{ post['search_condition'] }} </td>
    </tr>
    <tr>
        <td align="left" height="25">search_time_from </td>
        <td align="left" height="25">{{ post['search_time_from'] }} </td>
    </tr>
    <tr>
        <td align="left" height="25">search_step </td>
        <td align="left" height="25">{{ post['search_step'] }} </td>
    </tr>
    <tr>
        <td align="left" height="25">resend_period </td>
        <td align="left" height="25">{{ post['resend_period'] }} </td>
    </tr>
    <tr>
        <td align="left" height="25">threshold </td>
        <td align="left" height="25">{{ post['threshold'] }} </td>
    </tr>
</table>

</body>
</html>

vim list_item.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, list_item</title>
</head>
<body>

<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
    <tr>
        <td align="center" class="biaoti" height="60">日志告警接入统计表</td>
    </tr>
    <tr>
        <td align="right" height="25">当前时间: {{ posts['date_time'] }}</td>
    </tr>
</table>

<table  width="100%" border="0" cellspacing="1" cellpadding="4" bgcolor="#f5f5dc" align="center">
  <tr>
      <td>deploy_name</td>
      <td>search_time_from</td>
      <td>search_step</td>
      <td>resend_period</td>
      <td>threshold</td>
      <td>search_condition</td>
  </tr>
    {% for post in posts['data'] %}
     <tr>
      <td width="15%">{{ post['deploy_name'] }}</td>
      <td width="10%">{{ post['search_time_from'] }}</td>
      <td width="10%">{{ post['search_step'] }}</td>
      <td width="10%">{{ post['resend_period'] }}</td>
      <td width="10%">{{ post['threshold'] }}</td>
      <td width="45%">{{ post['search_condition'] }}</td>
     </tr>
    {% endfor %}
</table>

</body>
</html>

vim hello.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello Flask</title>
</head>
<body>
<div align="center">
    {% if name %}
    <h1>Hello, {{ name }}!</h1>
    {% else %}
    <h1>Hello, World!</h1>
    {% endif %}
</div>
</body>
</html>

3.3 测试结果

主页：
在这里插入图片描述
列表：
在这里插入图片描述
查看：
在这里插入图片描述
添加：
在这里插入图片描述
添加后返回信息
在这里插入图片描述

4 注意事项

  1. 前端提交数据的时候，使用html的form表单+action+method属性可以实现多种数据交互。

5 说明

测试软件环境：
python 3.8
flask 2.0.1
参考文档：
flask.palletsprojects.com/en/2.0.x/

昕光xg
关注
专栏目录
Python和Web--使用Web框架之Flask简单用例
Liu_Bruce的博客
03-09 377
Python和Web–使用Web框架之Flask简单用例 ​ 对于重要的Web应用，大多数人不会直接为其编写CGI脚本，而是选择使用Web框架，因为它会替你完成很多繁重的工作。这样的框架很多，今天我使用既简单又有用的Flask（http://flask.pocoo.org)上。使用pip安装这个框架，命令如下： $ pip install flask 下面编写一个计算幂的函数： def powers(n = 10): return ', '.join(str(2**i) for i in rang
[Python从零到壹] 七十七.图像识别及经典案例篇之目标检测入门普及和ImageAI对象检测详解
杨秀璋的专栏
04-28 801
前文介绍了人脸检测的应用案例，通过OpenCV快速实现人脸检测。这篇文章将详细讲解目标检测基础知识，并通过ImageAI实现对象检测的经典案例。本文主要介绍目标检测原理，通过七个问题来普及什么是目标检测。然后利用ImageAI实现最简单的目标检测案例，加深读者的印象，本文提供的案例将为读者提供深入的理解，希望您喜欢。
Flask Web开发 博客实例（一）flask框架理解
weixin_43983838的博客
07-26 1080
一、关于flask框架的理解 单脚本文件编写，可以参考大神博客https://www.cnblogs.com/senlinyang/p/8341774.html 有的小伙伴不理解flask结构里面那么多包和模块，所以本篇博客主要针对 flask 整个框架的理解，其中包含各个细节的链接。 顶层文件下还有虚拟环境 venv，配置文件config.py，主程序 flasky.py 1.1con...
python flask web_python flask几分钟实现web服务的例子
weixin_40007541的博客
11-28 70
目录：1.安装python32.安装flask3.简单的服务器代码编写4.设置FLASK_APP路径并启动服务器程序1.安装python3python3的安装这里就不过多赘述了，网上直接下载安装即可2.安装flask安装完Python3后我们就可以用pip工具进行安装了，当然还有很多安装方式大家可以自行百度。windows下使用cmd命令pip install flask3.简单的服务器代码mai...
Flask Web开发 博客实例（二）模板
weixin_43983838的博客
07-28 606
模板中的大概内容 以用户在网站中注册新账户的过程为例。用户在表单中输入电子邮件地址和密码，点击提交。于是，服务器接收到包含用户输入数据的请求，然后Flask把请求给处理注册请求的视图函数。这个视图再访问数据库，添加新用户，生成响应回送浏览器，指明操作是否成功。这两个过程分别为业务逻辑和表现逻辑。 把表现逻辑移到模板中能提升应用的可维护性。 模板是包含响应文本的文件，其中包含用占位变量表示的动态...
flask入门实例
04-05
flask开发应用入门实例，使用bootstrp3框架、数据库采用SQLIT，简单入门应用实例。
Web开发框架----Flask、jinja2入门与进阶
weixin_44568633的博客
02-25 2341
文章目录Web开发框架----Flask一、架构简介1.架构简介2.什么是Flask? Web开发框架----Flask 一、架构简介 1.架构简介 Nginx (engine x) 是一个高性能的HTTP和反向代理web服务器，同时也提供了IMAP/POP3/SMTP 服务 uWSGI是一个Web服务器（和后端交流），它实现了WSGI协议（与Flask等框架交流）、uwsgi、http（与Ng...
JavaScript 入门基础&案例
shhghvvh的博客
11-22 330
js基础知识及案例练习
flash actionscript3.0 从入门到精通 章精设 胡登涛.rar
01-11
总的来说，《Flash ActionScript 3.0 从入门到精通》不仅讲解了ActionScript的基础知识，还涵盖了高级主题，提供了一系列实用的案例，使得学习过程既理论又实践。无论你是希望提升个人技能的设计师，还是想要投身于...
FlashBuilder4快速入门
12-04
总之，《FlashBuilder4快速入门》是一本非常适合初学者和有一定基础的开发者的实用指南，不仅涵盖了基本概念和技术细节，还包括了大量的实践案例和技巧，是学习FlashBuilder4及其相关技术不可多得的好资源。
Flask入门教程实例：搭建一个静态博客
12-23
现在流行的静态博客/网站生成工具有很多，比如 Jekyll, Pelican, Middleman, Hyde 等等，StaticGen 列出了目前最流行的一些静态网站生成工具。 我们的内部工具由 Python/Flask/MongoDB 搭建，现在需要加上文档功能，写作格式是 Markdown，不想把文档放到数据库里，也不想再弄一套静态博客工具来管理文档，于是找到了 Flask-FlatPages 这个好用的 Flask 模块。熟悉 Flask 的同学花几分钟的时间就可以用搭建一个简单博客，加上 Bootstrap 的帮助，不到一小时内就可以用 Flask-Flatpages 弄个像模像样的
python中Flask框架简单入门实例
01-21
本文实例讲述了python中Flask框架的简单用法。分享给大家供大家参考。具体如下： 使用Flask框架的简单入门范例代码，如果你正学习Flask框架，可以参考下面的启动代码，这段代码可以在网页上输出“hello world” import os # Using Flask since Python doesn't have built-in session management from flask import Flask, session app = Flask(__name__) # Generate a secret random key for the session app.
python的简单web框架flask【附例子】
最新发布
分享技术，分享经验
05-21 2040
今天好奇，去了解了一下python的web框架。
Flask入门学习教程
m0_67392661的博客
08-01 336
Flask是目前十分流行的web框架，采用Python编程语言来实现相关功能。它被称为微框架(microframework)，“微”是指Flask旨在保持代码简洁且易于扩展，Flask框架的主要特征是核心构成比较简单，但具有很强的扩展性和兼容性。Flask主要包括Werkzeug和Jinja2两个核心函数库，它们分别负责业务处理和安全方面的功能，这些基础函数为web项目开发过程提供了丰富的基础组件。...
Python Flask web入门例子
weixin_34194317的博客
02-13 81
安装pip -安装完python，需要手动设置pip环境变量，找到python安装目录的Scripts文件夹中就是根目录，比如C:\Python27\Scripts。设置完环境变量即可安装第三方模块了，安装时为了提高速度可以使用阿里镜像，方法如下 打开目录：C:\Users\xxx\AppData\Roaming,xxx是windows用户名 在该目录中新建目录pop，在pop目录中在新建pip...
flask入门
weixin_45053522的博客
04-15 661
flask程序编写步骤： 1.导入flask扩展 from flask import Flask 2.创建flask应用程序实例 app = Flask(__name__) #__name__是为了确定资源所在路径 3.定义路由及应用程序实例 #Flask中定义路由是通过装饰器实现的 app是一个装饰器 @app.rout('/') def index(): return 'hello flask' 4.启动程序 if __name__ = '__main__' #执行app.run.就会将Fla
Python Web 框架 Flask 入门示例
02-24 1263
Flask是一个使用 Python 编写的轻量级 Web 应用框架。其 WSGI 工具箱采用 Werkzeug ，模板引擎则使用 Jinja2 。官方建议使用 Python 2.6 或 2.7 开发， Python 3 还有些问题没解决。如已安装有 Python 3 了，可以使用 virtualenv 创建使用 python 2.7 的虚拟环境。示例比较简单，使用的数据库为 sqlite，因此先安...
Flask入门示例及常用方法
大道至简
11-02 382
Python有两大Web应用开发框架，其中之一的后起之秀Flask虽然起步较晚，但很快赢得了广大开发者的热爱。最大的特点就是轻量、上手快，以下我们来演示如何创建一个简单的Flask应用。
flask入门的教程-Hello, World! (this article)
最近学习openerp 期待交流
05-06 979
文章转自：https://github.com/WapeYang/The-Flask-Mega-Tutorial/blob/master/helloworld.rst 感谢原作者的付出
Flex Builder 4入门：实战Web通信教程
"《Flash Builder 4 快速入门 Flex actionscript web通信》是一本由国内最大...《Flash Builder 4 快速入门 Flex actionscript web通信》是一本全面且实用的Flex开发指南，无论是新手还是进阶开发者都能从中受益匪浅。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

昕光xg

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值