由浅入深的项目实战,以下文章均基于python11执行和编写(会尽量向下兼容编写代码)

体重计算器

该项目基于web后端html渲染做的一个基础的网页版体重计算器,用于初步认识flask的基础项目

新建项目

在项目开始之前,我们需要规定存放特定文件的文件夹。

由于项目规模非常小,我们只需要新建一个Template文件夹作为存放html模板的文件夹即可。

新建html

在项目开始前,我们需要准备一个html页面,命名为index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算DMI</title>
</head>
<body>
<form action="/gen_dmi">
  <ul type="None">
    <li>
      <input type="text", name="height", placeholder="输入身高,单位为cm">
    </li>
    <li>
      <input type="text", name="weight", placeholder="输入体重,单位为kg">
    </li>
    <li>
      <input type="text", name="age", placeholder="输入年龄">
    </li>
    <li>
      <select name="gender">
        <option>男</option>
        <option>女</option>
      </select>
    </li>
    <li>
      <input type="submit", value="计算DMI">
    </li>
  </ul>
​
</form>
​
</body>
</html>

新建控制器

接下来我们创建一个控制器,在项目目录中新建模块IndexController.py,代码如下:

from flask import Flask, render_template
​
app = Flask(__name__, template_folder="./Template/")
​
​
@app.route("/")
def index():
    return render_template("index.html")
​
​
if __name__ == '__main__':
    app.run(debug=True)

由上到下,我们首先新建了一个Flask app,指定模板文件夹为./Template/

接着我们新建了一个index()方法,指定路由为/(即不输入任何字符即可调用index方法),方法后返回一个由flask渲染后的html模板

最后,我们在main中调用了app.run,并开启了debug模式。

控制器创建好后,我们只需要运行这个控制器,即可开启整个web项目了,输出如下:

 * Serving Flask app 'IndexController'
 * Debug mode: on
WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.
 * Running on http://127.0.0.1:5000
Press CTRL+C to quit
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 454-905-054

在浏览器中输入http://127.0.0.1:5000即可访问我们创建的网址。

表单数据提交处理

由上面新建的html我们知道,当我们点击计算DMI这个按钮时,整个表单会将数据传输到接口中http://127.0.0.1:5000/gen_dmi,而数据的标签根据inputselection中的属性name传输到后台

首先我们需要新建一个dmi计算类,命名为CaculateUtils.py,输入如下代码:

class CaculateUtils:
    """体脂率计算工具类"""
​
    @classmethod
    def BMI_caculate(cls, height, weight):
        """
        体重指数法(BMI)计算
​
        :param height: 身高,单位为cm
        :param weight: 体重,单位为kg
        :return: BMI
        """
        weight_transport = height / 100  # 将cm转换为m
        BMI_result = weight / (weight_transport * weight_transport)
        return round(BMI_result, 1)
​
    @classmethod
    def BMI_testing(cls, BMI):
        """
        通过BMI查看体质
​
        :param BMI: BMI指数
        """
        if BMI < 18.5:
            return "偏瘦体质"
        elif BMI >= 18.5 and BMI <= 23.9:
            return "标准体质"
        elif BMI >= 24 and BMI <= 27.9:
            return "偏胖体质"
        else:
            return "肥胖体质"
​
    @classmethod
    def heat_consumption(cls, gender, height, weight, age, coefficient_of_motion=1.2):
        """
        热量消耗计算器
​
        :param gender: 性别,1为男性,0为女性
        :param height: 身高,单位为cm
        :param weight: 体重,单位为kg
        :param age: 年龄
        :param coefficient_of_motion: 运动系数,分别为:1.2(静坐,无运动);1.375(1-3次运动/周);1.55(3-5次运动/周);1.725(6-7次运动/周);1.9(专业运动员);
        :return: 日常消耗量,单位为卡路里(kcal)
        """
        result = -1
        if gender == 1:
            result = 90 + 4.8 * height + 13.4 * weight - 5.7 * age
        elif gender == 0:
            result = 450 + 3.1 * height + 9.2 * weight - 4.3 * age
        if result != -1:
            result *= coefficient_of_motion
        return round(result, 3)

为了展示计算的结果,我们需要新建一个html,命名为result.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算DMI结果</title>
</head>
<body>
<ul>
<li>
  <span>{{ dmi }}</span>
</li>
<li>
  <span>{{ heat_consumption }}</span>
</li>
<li>
  <span>{{ bmi_testing }}</span>
</li>
</ul>
</body>
</html>

其中\{\{\}\}是jinja2中的写法,用于接收参数并渲染在html中。我们在html中写好三个参数dmiheat_consumptionbmi_testing,等待控制器返回。

在控制器IndexController.py中新建方法gen_dmi,代码如下:

from flask import request
from CaculateUtils import CaculateUtils
​
@app.route("/gen_dmi")
def gen_dmi():
    args = request.args
    height = int(args["height"])
    weight = float(args["weight"])
    age = int(args["age"])
    gender = 1 if args["gender"] == "男" else 0
    heat_consumption = CaculateUtils.heat_consumption(gender, height, weight, age)
    dmi = CaculateUtils.BMI_caculate(height, weight)
    bmi_testing = CaculateUtils.BMI_testing(dmi)
    return render_template("result.html", dmi=f"DMI指数: {dmi}", heat_consumption=f"消耗热量: {heat_consumption}卡", bmi_testing=f"体质类型: {bmi_testing}")

在该方法中,我们用request.args接收form表单中传入的数据(以字典形式返回),并在key中输入form表单上的name属性的对应字符(比如说声高的输入项的name属性为height等)来获取对应的value。

获取value后,我们就可以用这些value进行我们想要的处理了。

处理后的结果,在render_template中以形参的形式一一对应,注意形参要和result.html中写好的三个参数相同。

点击运行,在主页上面输入数值点击按钮提交后,就跳转到result.html里面了。

文章作者: Vsoapmac
版权声明: 本站所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 soap的会员制餐厅
后端 框架
喜欢就支持一下吧