[Flask]环境配置和项目框架的构建

news/2024/9/12 17:27:36/

一、配置flask

        在Python环境下使用控制台的pip install命令进行安装

pip install Flask==2.1.0

                !!!安装版本必须是2.x以上,否则可能出现错误:cannot import name 'escape' from 'jinja2' (flask 2.x放弃了对jinjia2的支持所以不会出现此问题)

        本文中所有操作均基于vscode,如需了解vscode如何配置请参见之前的博客:在VS Code下搭建PyTorch环境https://blog.csdn.net/weixin_37878740/article/details/127069779

二、创建项目

        直接新建一个py文件(对,直接新建,不用参照网上什么乱七八糟的改配置文件),在其中输入以下代码:

from flask import Flask        #导入Flask包
app = Flask(__name__)@app.route('/')                #设置路由
def hello_world():return "Hello World"if __name__ == "__main__":     #启动程序app.run()

        按F5启动后用浏览器访问控制台下出现的网址即可。控制台也会实时接显示收到的http命令

         其中@app.route和后面的视图函数映射为其主要功能区块,通过更改路由路径即可实现不同路径的不同返回。

@app.route('/Fxxk')
def Fxxk():return "So, Nivda Fxxk U"

 三、参数设置

        ①Debug模式

                启用Debug模式后可以实现实时修改实时查看,否则必须重启项目才能查看修改部分。

                有两种启动方法

app.debug = True
app.run()
app.run(debug=True)

                看到控制台有以下显示即开启成功

         ②修改Host和Port

                同上可以采用两种方法,这里展示方法2。同时,申请的端口号必须是没有被占据的端口号,比如你申请192.168.1.1就会报错。

app.run(host='127.0.0.2',port=5003,debug=True)

 四、URL传参

        ①直接传参

@app.route('/login/<id>')
def LogIn(id):return "欢迎回来{}".format(id)

                 如出现错误:发生异常: SystemExit。可将调试器中的此项关闭

                 如需要指定类型可以在参数前添加类型指定,如:

@app.route('/login/<int:id>')
def LogIn(id):return "欢迎回来{}".format(id)

                常见的类型如下:

string字符串型,但是不能接受/
int整型
float浮点型
path字符串路径,可以接受/
uuidUUID类型,有一组32位的16进制数据构成
any备选值中的任何类型,类似于枚举,示例:<any(a,b,c):type>

        ②Request传参

                需要导入request包

from flask import request
@app.route('/book/list')
def book_list():page = request.args.get("page",default=1,type=int)      #参数名,默认参数,参数类型return "您要查看的是{}页".format(page)

                           

五、渲染HTML文件

        ①渲染静态文件

                新建一个html文件,按照惯例建议存放在工程文件目录下的templates文件夹下。

                在Python代码中需要导入render_template,随后在视图映射函数中将返回修改为:

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

                函数会自动在templates文件夹下查找同名的文件并渲染返回给浏览器 。

         ②渲染动态文件

                获取参数的方式与第四章URL传参一致,但是需要使用render_template进行参数传递,即在页面后面将参数赋值给页面即可

@app.route('/login/<id>')
def LogIn(id):return render_template("login.html",id = id)

                随后在页面中也需要进行相应的操作,使用双花括号括住需要的变量名即可

<html lang="en"><head><meta charset="UTF-8"><title>∞</title></head><body><h1>您登录的账号为:{{id}}</h1></body>
</html>

         ③访问自定义类型

                如果需要通过自定义类型传递数据的话,仅需要将类作为参数传递给html,然后在html中使用类型名.属性名的方法访问即可。

class User:def __init__(self,username,email):self.username=usernameself.email=email@app.route('/IKUN')
def LogIn():user = User(username="iKun",email="JNTM@kun.com")return render_template("login.html",user=user)
<h1>您的账号为:{{user.username}}</h1>
<h1>您的邮箱为:{{user.email}}</h1>

                 但如果传递的是Json字典的话,则在HTML文件中可以使用两种方法对其进行访问:

                        ①类型名.属性名

                        ②类型名['属性名']

user = {"username":"iKun","email":"JNTM@kun.com"}
<h1>您的账号为:{{user['username']}}</h1>
<h1>您的邮箱为:{{user.email}}</h1>

        ④过滤器

                过滤器可以在HTML页面中进行一些检查的数据处理,使用过滤器需要借助管道操作符 | ,来实现,在HTML中做如下修改

<h1>您的账号长度为{{user.username|length}}</h1>

                Jinja2具体过滤器的种类以及功效请参见HTML专题(别点了,还没写呢)

        自定义过滤器:过滤器的本质是python代码,所以也可以在python文件中进行自行编写,定义方法如下:

def Datefomat(value,format="%Y年%m月%d日 %H:%M"):return value.strftime(format)

                 value为需要处理的值,必不可少,其他的看需求自行定义。

                随后使用app.add_template_filter将该过滤器添加到模板中,参数1为函数名,参数2为在HTML中调用的名称。

app.add_template_filter(Datefomat,"dformat")

                随后在HTML中和普通过滤器一样调用即可。

<h1>当前时间为:{{Now|dformat}}</h1>

         ⑤控制语句

                Jinja2模板中包含两组控制语句:if-else和for。

{ % if 条件 % }接实现的HTML
{ % elif 条件 % }接实现的HTML
{ % else 条件 % }接实现的HTML
{ % endif % }

                注意:必须要有endif结尾,否则会报错

{% for book in books %}<div>图书名称{{book.name}},作者{{book.author}}</div>
{% endfor %}

                同样需要结尾收束,且不能中途中断。

        ⑥加载静态文件

                静态文件需置于static文件夹下,可在控件中使用文件路径的方式进行加载。这里以图片为例。

                 将图片路径作为网页参数传递。

@app.route('/Img')
def LoadImg():imgId = request.args.get("id",type=str)return render_template("Loader.html",imgId = imgId)

                HTML中以url_for进行加载,第一个参数默认为static 

<img src="{{url_for('static',filename=imgId)}}" alt="">

                同时也可加载js脚本

<scrip src="{{url_for("static",filename='js/my.js')}}"/>


http://www.ppmy.cn/news/6461.html

相关文章

SQLite数据库-学生管理系统(2.0)

SQLite数据库-学生管理系统 1.要求 布局文件 --------View层Activity文件---------Controller层Helper文件&#xff1a;建立数据库和表&#xff0c;版本更新Dao层&#xff1a;对数据库表中数据增删改查操作Entity&#xff1a;数据库在项目中的类&#xff0c;主要用于定义与数据…

Listener监听器 | 监听域对象创建和销毁、使用监听器统计网站在线人数

目录 一&#xff1a;监听域对象创建和销毁 1、什么是监听器&#xff1f;监听器有什么用&#xff1f; 2、Servlet规范中提供了哪些监听器&#xff1f; 3、实现一个监听器的步骤 4、HttpSessionBindingListener 5、HttpSessionIdListener & HttpSessionActivationList…

git status查看本地库状态、git add添加暂存区

假设目前我处于我的项目之下。 查看状态命令 git status 可以看到如下的状态 现在我新建一个文件hello.txt 在里面写了16行的内容。&#xff08;这个vim之前也没有使用过&#xff0c;在最后记录一下。&#xff09; 再看一下状态 那我们现在就add一下&#xff0c;使用命令&…

前端如何优雅的实现跨终端开发(PC端+移动端)

文章目录解决方案一&#xff1a;使用CSS媒体查询。解决方案二&#xff1a;写两套代码&#xff0c;分别应用于PC端和移动端。推荐方案&#xff1a;使用CabloyJS相关链接解决方案一&#xff1a;使用CSS媒体查询。 这是传统的解决方案。使用一套代码&#xff0c;先做PC端&#xf…

C++ 实现智能指针:shared_ptr 和 unique_ptr

简 述: C11 智能指针的深入分析&#xff0c;和动手实现简版的智能指针 std::shared_ptr 、std::unique_ptr 文章目录背景std::shared_ptr原理代码referencestd::unique_ptr原理代码reference系列本文初发于 “偕臧的小站”&#xff0c;同步转载于此。 背景 实现原理提前需要理…

SpringBoot图文详解 | 系统性学习 | 无知的我费曼笔记

无知的我复盘&#xff0c;顺便上传笔记。 对比Spring&#xff0c;SpringBoot 其实就是简化了固定的开发步骤。如坐标、Web3.0配置类、配置类 文章目录1 SpringBoot简介1.1 SpringBoot快速入门1.1.1 开发步骤1.1.1.1 创建新模块1.1.1.2 创建 Controller1.1.1.3 启动服务器1.1.1.…

【实时数仓】DWS层之地区主题表(FlinkSQL)、关键词主题表(FlinkSQL)

文章目录一 DWS层-地区主题表(FlinkSQL)1 分组开窗和聚合计算&#xff08;1&#xff09;分组窗口&#xff08;2&#xff09;选择分组窗口的开始和结束时间戳&#xff08;3&#xff09;系统内置函数&#xff08;4&#xff09;完整代码2 将动态表转换为流&#xff0c;写入ClickHo…

现在请你帮忙编程计算出每位学生的总分和每门课程的平均分,以便帮助他快速统计出同学们的课程学习效果吧

【题目描述】 大一第一学期的期中考试结束了&#xff0c;辅导员急切的想了解同学们的学习情况&#xff0c;现在请你帮忙编程计算出每位学生的总分和每门课程的平均分&#xff0c;以便帮助他快速统计出同学们的课程学习效果吧&#xff01; 【输入】 有多行。第1行是两个整数n…

中文文本分类

手把手带你做一个文本分类实战项目(模型代码解读) https://www.bilibili.com/video/BV15Z4y1S7aR/?spm_id_from333.788.recommend_more_video.-1&vd_sourcec47fbb8166930edc486d8fdc405bf569 中文汉字对应的数字索引 之后对应的数字索引 之后找到tokn embedding的东西 1…

暂时性死区以及函数作用域

暂时性死区 暂时性死区也就是变量声明到声明完成的区块&#xff0c;这个区块是一个封闭的作用域&#xff0c;直到声明完成。 如果在变量声明之前使用该变量&#xff0c;那么该变量是不可用的&#xff0c;也就被称为暂时性死区。 var 没有暂时性死区&#xff0c;因为var存在变…

12月24日:数据结构

Btree结构 ​​​​​​ BTree和BTree详解_菜鸟笔记的博客-CSDN博客_btree 简单的说一下什么是聚簇索引 , 和非聚簇索引有啥区别 聚簇索引&#xff1a;索引和数据存储放在了同一个文件中&#xff0c;找到了索引也就能找到数据 非聚簇索引&#xff1a;将数据存储和索引分开放置…

使用 Swift/SwiftUI 的音频可视化

IOS 应用程序中的音频可视化是一项流行的功能,在实现聊天功能时可能需要它。将它添加到我最近的项目之一时,我个人遇到了一些问题。 你们中的一些人可能在开发包含聊天功能的应用程序时遇到过问题,其中某些消息可能包含音频。这些消息需要在应用程序内进行适当的音频可视化,…

(倒序输出数组)交换的规则是:1号礼物与n号礼物互换,2号礼物与n-1号礼物互换,以此类推,请帮助他们找到喜欢的礼物吧!

【题目描述】 一年一度的毕业季&#xff0c;马上要离开校园踏上工作岗位的同学们在拍摄完照片之后&#xff0c;大家有了一个共同的想法——那就是在毕业前互换礼物。到了约定的日子&#xff0c;同学们带来的礼物琳琅满目&#xff0c;都不知道该如何交换了。于是&#xff0c;在…

Linux内核中的panic

目录 一、内核配置 二、程序触发panic 三、命令行执行触发panic 四、panic源码 解析panic 五、系统收到收到panic处理方式 六、编写自定义内核panic处理程序例程 1、内核中的使用 2、自定义处理函数示例 七、实例代码 一、内核配置 CONFIG_MAGIC_SYSRQy 二、程序触…

【Unity】【Pico】手柄摇杆控制第一人称移动和旋转

【Unity】【Pico】手柄摇杆控制第一人称移动和旋转 背景&#xff1a;开发影院系统 环境&#xff1a;Unity2021.3、PicoNeo3ProEye 描述&#xff1a;已经在Unity项目中实现第一人称WASD移动和鼠标旋转&#xff08;代码见我的其他博文&#xff09; 需求&#xff1a;希望项目在Pi…

035-接口设计报告-V1.0

文档编号&#xff1a;xxxxxxxxxxx <项目名称> 接口设计报告 《公司名称》 2012年4月 关于本文档 主 题 说  明 适用对象 修 订 历 史 版 本 章 节 类 型 日 期 作 者 说 明 …

vue学习笔记(七)-vue3新特性

概念 vue3简介 2020年9月18日&#xff0c;Vue.js发布3.0版本&#xff0c;代号&#xff1a;One Piece&#xff08;海贼王&#xff09;耗时2年多、2600次提交、30个RFC、600次PR、99位贡献者github上的tags地址&#xff1a;https://github.com/vuejs/vue-next/releases/tag/v3.0…

消息队列RabbitMQ学习笔记(四)死信队列和延迟队列

1. 死信的概念 先从概念解释上搞清楚这个定义&#xff0c;死信&#xff0c;顾名思义就是无法被消费的消息&#xff0c;字面意思可以这样理 解&#xff0c;一般来说&#xff0c;producer 将消息投递到 broker 或者直接到queue 里了&#xff0c;consumer 从 queue 取出消息 进行…

react学习

1. React概述 1.1 什么是react&#xff1f; React 是一个用于构建用户界面的 JavaScript 库 用户界面:HTML页面(前端) React 主要用来写HTML页面&#xff0c;或构建Web应用如果从 MVC 的角度来看&#xff0c;React 仅仅是视图层(V)&#xff0c;也就是只负责视图的染&#xff0…

车用DC-DC模块 1224V转8V3A过认证大塑料外壳

名称&#xff1a;车用12V转8V3A电源转换器 型号&#xff1a;LM40J8V3A3S 性质&#xff1a;非隔离型的BUCK电源转换器&#xff0c; 特点&#xff1a;采用集成IC设计&#xff0c;具有转换效率高&#xff0c;体积小&#xff0c;稳定可靠的特点&#xff0c;采用灌胶工艺&#xf…