大数据疫情监控项目(Ⅱ)—Flask入门

大数据疫情监控项目(Ⅱ)—Flask入门

  • Flask概述
    • 创建Flask项目
      • 第一个 hello word
    • Flask请求参数
    • Flask调用模板
  • 使用Ajax刷新页面
  • 小结

近日在小破站看到的项目,觉得有趣,便尝试动手实操,实现脑图如下,仅以此项目向逆行者表以最崇高的敬意。
在这里插入图片描述

Flask概述

 Flask 是一个使用 Python 编写的轻量级 Web 应用框架。其 WSGI(Python
Web Server Gateway Interface) 工具包采用 Werkzeug ,模板引擎则使
用 Jinja2 ,是目前十分流行的 web 框架。
安装:在命令界面输入

pip install flask

创建Flask项目

 在pycharm中新建一个Flask(需要专业版本)
大数据疫情监控项目(Ⅱ)—Flask入门_第1张图片一个Flask项目一般有三个部分组成:

1、staic:用于存取json、css等文件;
2、templates:笔者觉得有点像前端,在里面可以编写页面模板html文件
3、外面的py程序:笔者觉得有点像后段,运行后可以呈现出页面。
真乃前端后端一锅端,加上爬虫SQL成全栈
大数据疫情监控项目(Ⅱ)—Flask入门_第2张图片

第一个 hello word

from flask import Flask
app1= Flask(__name__)
#申请一个路由
@app1.route('/')
def hello_world():
    return 'Hello World!'


if __name__ == '__main__':
    app1.run()
  • 运行结果
    大数据疫情监控项目(Ⅱ)—Flask入门_第3张图片

Flask请求参数

  1. 使用request请求参数
  • request.values 获取参数字典;
  • request.values.get(“参数名”)
    以本次登入账号为例敲出例子:
from flask import Flask
from flask import request

app1= Flask(__name__)
#申请一个路由
@app1.route('/')
def hello_world():
    return 'Hello World!'

#增加一个路由器
@app1.route('/abc')
def hello_word1():
    #利用request请求参数
    id = request.values.get("id")
    return f"""
    
账号:
密码:
"""
if __name__ == '__main__': app1.run()

在原网址的基础上+/abc可以进入
大数据疫情监控项目(Ⅱ)—Flask入门_第4张图片

Flask调用模板

在py文件中调用已经编写好的.html网页文件,1疫情的简单页面为例

  • html文件:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> my page</title>
</head>
<body>
<h1>疫情追踪<h1>
<h2>实时报道</h2>
</body>
</html>
  • .py中调用
#导入一个模板
from flask import render_template
@app1.route('/tem')
def hello_world3():
    return render_template("index1.html")

在原网址的基础上+/tem即可进入html界面
大数据疫情监控项目(Ⅱ)—Flask入门_第5张图片

使用Ajax刷新页面

  • Ajax 是 Asynchronous JavaScript and XML 的简称,通过 Ajax 向服务器发送请求,接收服器返回的 json 数据,然后使用 JavaScript 修改网页的来实现页面局部数据更新
  • 使用 jquery 框架可方便的编写 ajax代码,需要 jquery.js 文件
    一般的语法使用格式为:
    大数据疫情监控项目(Ⅱ)—Flask入门_第6张图片
     使用举例:
  • html前端设计:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>my page</title>
    <script src="../static/js/jquery-1.11.1.min.js"></script>
</head>
<body>
<h1>疫情追踪</h1>
<h2>实时报道</h2>
<button>点我有惊喜</button>


<script>
    $("button").click(function(d){
        $.ajax({

            url:"/ajax",//请求地址
            type:'post',//请求类型
            data:{"name":"李四","score": 99},//数据


        success:function (d){
            //请求成功的回调函数

            $("h1").html("武汉感染人数:"+d)
        },
        error:function(){
        //请求失败的回调函数
            alert('发送ajax失败')
        }
})
})
</script>
</body>
</html>
  • 后端函数设计:
#导入一个模板实现局部创新
@app.route('/ajax',methods=['get','post'])
def hello_world4():
    return '10000'
  • 运行效果
    大数据疫情监控项目(Ⅱ)—Flask入门_第7张图片
    可以看出标签h1出已经被更新。

小结

 此处知识笔者并未进行过系统的学习,上述主要为基于项目的知识点学习,其中不足,望读者多多指正。

你可能感兴趣的:(大数据,python)