15分钟学 Python 第30天：Web编程基础

凡人的AI工具箱

于 2024-09-30 14:29:31 发布

阅读量372

点赞数 16

分类专栏： 15分钟学Python 文章标签： python 开发语言后端人工智能数据结构

本文链接：https://blog.csdn.net/weixin_40780178/article/details/142656069

版权

15分钟学Python 专栏收录该内容

34 篇文章 3 订阅

订阅专栏

Day 30: Web编程基础

教学目标

理解 Flask 框架的基本使用
学习如何处理表单数据
掌握基本的数据库操作
理解 Web 应用的请求/响应周期

课程大纲

Flask 框架介绍
环境搭建
项目结构
实现用户账户功能
- 创建账户
- 存款
- 取款
- 查询余额
数据库操作
总结与练习

1. Flask 框架介绍

Flask 是一个轻量级的 Python Web 框架，适合快速开发 Web 应用。它提供了路由、请求处理等基本功能，易于学习和使用。

2. 环境搭建

2.1 安装 Flask

首先，确保你的开发环境中安装了 Python 3。接下来，可以使用以下命令安装 Flask：

pip install Flask

2.2 项目依赖

我们还需要安装 Flask 的扩展库 Flask-SQLAlchemy 来处理数据库：

pip install Flask-SQLAlchemy

3. 项目结构

我们将项目构建在以下目录结构中：

banking_system/
│
├── app.py
├── models.py
├── templates/
│   ├── index.html
│   ├── create_account.html
│   ├── deposit.html
│   ├── withdraw.html
│   └── balance.html
└── static/
    └── styles.css

app.py：主应用文件。
models.py：数据库模型。
templates/：存放 HTML 模板的文件夹。
static/：存放静态文件（如 CSS）的文件夹。

4. 实现用户账户功能

4.1 创建数据库模型

在 models.py 中定义用户账户模型。

# models.py
from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()

class Account(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    username = db.Column(db.String(80), unique=True, nullable=False)
    balance = db.Column(db.Float, default=0.0)

    def __repr__(self):
        return f'<Account {self.username}>'

4.2 创建 Flask 应用

在 app.py 中初始化 Flask 应用和数据库。

# app.py
from flask import Flask, render_template, request, redirect, url_for, flash
from models import db, Account

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///banking.db'
app.config['SECRET_KEY'] = 'your_secret_key'
db.init_app(app)

@app.before_first_request
def create_tables():
    db.create_all()

if __name__ == '__main__':
    app.run(debug=True)

5. 实现功能

5.1 创建账户

实现创建账户的视图。

@app.route('/create_account', methods=['GET', 'POST'])
def create_account():
    if request.method == 'POST':
        username = request.form['username']
        existing_account = Account.query.filter_by(username=username).first()
        if existing_account:
            flash('账户已存在!')
            return redirect(url_for('create_account'))
        new_account = Account(username=username)
        db.session.add(new_account)
        db.session.commit()
        flash('账户创建成功!')
        return redirect(url_for('index'))
    return render_template('create_account.html')

表单 HTML (create_account.html)

<!-- templates/create_account.html -->
<!doctype html>
<html lang="en">
<head>
    <title>创建账户</title>
</head>
<body>
    <h1>创建账户</h1>
    <form method="POST">
        <label>用户名:</label>
        <input type="text" name="username" required>
        <button type="submit">创建</button>
    </form>
</body>
</html>

5.2 存款功能

实现存款功能。

@app.route('/deposit', methods=['GET', 'POST'])
def deposit():
    if request.method == 'POST':
        username = request.form['username']
        amount = float(request.form['amount'])
        account = Account.query.filter_by(username=username).first()
        if account:
            account.balance += amount
            db.session.commit()
            flash('存款成功!')
        else:
            flash('账户不存在!')
        return redirect(url_for('index'))
    return render_template('deposit.html')

存款表单 HTML (deposit.html)

<!-- templates/deposit.html -->
<!doctype html>
<html lang="en">
<head>
    <title>存款</title>
</head>
<body>
    <h1>存款</h1>
    <form method="POST">
        <label>用户名:</label>
        <input type="text" name="username" required>
        <label>金额:</label>
        <input type="number" name="amount" required>
        <button type="submit">存款</button>
    </form>
</body>
</html>

5.3 取款功能

实现取款功能。

@app.route('/withdraw', methods=['GET', 'POST'])
def withdraw():
    if request.method == 'POST':
        username = request.form['username']
        amount = float(request.form['amount'])
        account = Account.query.filter_by(username=username).first()
        if account and account.balance >= amount:
            account.balance -= amount
            db.session.commit()
            flash('取款成功!')
        else:
            flash('账户余额不足或账户不存在!')
        return redirect(url_for('index'))
    return render_template('withdraw.html')

取款表单 HTML (withdraw.html)

<!-- templates/withdraw.html -->
<!doctype html>
<html lang="en">
<head>
    <title>取款</title>
</head>
<body>
    <h1>取款</h1>
    <form method="POST">
        <label>用户名:</label>
        <input type="text" name="username" required>
        <label>金额:</label>
        <input type="number" name="amount" required>
        <button type="submit">取款</button>
    </form>
</body>
</html>

5.4 查询余额

实现查询余额功能。

@app.route('/balance', methods=['GET', 'POST'])
def balance():
    if request.method == 'POST':
        username = request.form['username']
        account = Account.query.filter_by(username=username).first()
        if account:
            return render_template('balance.html', balance=account.balance, username=username)
        else:
            flash('账户不存在!')
    return render_template('balance.html', balance=None)

查询余额功能 HTML (balance.html)

<!-- templates/balance.html -->
<!doctype html>
<html lang="en">
<head>
    <title>查询余额</title>
</head>
<body>
    <h1>余额查询</h1>
    <form method="POST">
        <label>用户名:</label>
        <input type="text" name="username" required>
        <button type="submit">查询</button>
    </form>
    {% if balance is not none %}
        <h2>{{ username }}的余额: {{ balance }}</h2>
    {% endif %}
</body>
</html>

6. 数据库操作

数据库操作非常重要，我们在每个操作后都对数据库进行了提交以保存数据。

代码运行流程图

以下是简易银行系统的流程图：

+--------------------+
|      用户访问      |
|    / 创建账户      |
+--------------------+
          |
          v
+--------------------+
|   填写账户信息    |
+--------------------+
          |
          v
+--------------------+
|  存入数据库        |
+--------------------+
          |
          v
+--------------------+
|  返回成功页面      |
+--------------------+