Flask Web 开发入门笔记

目录

[一、客户端与服务器端架构（CS 架构）](#一、客户端与服务器端架构（CS 架构）)

[1.1 什么是 CS 架构](#1.1 什么是 CS 架构)

[1.2 客户端与服务器的分工](#1.2 客户端与服务器的分工)

[二、HTTP 协议详解](#二、HTTP 协议详解)

[2.1 HTTP 协议是什么](#2.1 HTTP 协议是什么)

[2.2 访问网页时发生了什么](#2.2 访问网页时发生了什么)

[2.3 IP 地址与域名](#2.3 IP 地址与域名)

[2.4 GET 请求与 POST 请求](#2.4 GET 请求与 POST 请求)

[（1）GET 请求](#（1）GET 请求)

[（2）POST 请求](#（2）POST 请求)

[（3）GET 与 POST 对比总结](#（3）GET 与 POST 对比总结)

[2.5 常见 HTTP 状态码](#2.5 常见 HTTP 状态码)

[三、JSON 数据格式](#三、JSON 数据格式)

[3.1 JSON 是什么](#3.1 JSON 是什么)

[3.2 JSON 基本语法](#3.2 JSON 基本语法)

[3.3 JSON 与 Python 字典的互相转换](#3.3 JSON 与 Python 字典的互相转换)

[四、Flask 框架](#四、Flask 框架)

[4.1 Flask 简介](#4.1 Flask 简介)

[4.2 安装 Flask](#4.2 安装 Flask)

[4.3 Flask 基本使用------服务器端](#4.3 Flask 基本使用——服务器端)

[4.4 Flask 基本使用------客户端调用](#4.4 Flask 基本使用——客户端调用)

[4.5 Flask 路由与请求方式](#4.5 Flask 路由与请求方式)

[4.6 GET 请求示例](#4.6 GET 请求示例)

[4.7 POST 请求示例](#4.7 POST 请求示例)

[4.8 返回 JSON 数据](#4.8 返回 JSON 数据)

---

一、客户端与服务器端架构（CS 架构）

1.1 什么是 CS 架构

CS 架构，即 Client-Server（客户端-服务器端）架构 ，是网络应用中最基本的通信模型。整个互联网的运作都基于这种架构：客户端发起请求，服务器端处理请求并返回结果。

1.2 客户端与服务器的分工

角色	说明
客户端（Client）	用户使用的电脑、手机等设备，运行应用程序（如浏览器、APP），负责向服务器发出请求
服务器（Server）	处理请求、存储数据、返回结果的核心计算机，通常性能更强、长期在线

简单理解： 客户端是"点菜的顾客"，服务器是"做菜的厨房"。顾客告诉厨房要什么菜，厨房做好后端上来。

---

二、HTTP 协议详解

2.1 HTTP 协议是什么

HTTP，全称 HyperText Transfer Protocol ，翻译过来就是 超文本传输协议。它是客户端和服务器之间沟通的"语言"------双方都遵守这套规则，才能互相理解。

补充说明： HTTP 属于应用层协议，它运行在 TCP 协议之上。TCP 负责保证数据可靠传输，HTTP 负责定义数据的格式和交互规则。

2.2 访问网页时发生了什么

以访问百度为例，整个过程如下：

步骤1：你在浏览器地址栏输入 http://www.baidu.com
    ↓
步骤2：浏览器按照 HTTP 规则，向百度服务器发出一个请求
      "我想要 www.baidu.com 的首页内容！"
    ↓
步骤3：百度服务器接收请求，返回一个响应
      "好的，这是首页的 HTML 文件，请拿去！"
    ↓
步骤4：浏览器拿到响应后，解析 HTML，
      再去下载图片、CSS、JS 文件，
      最后把完整的页面展示出来。

整个过程中，每一次"要东西"和"给东西"的沟通，都是走的 HTTP 协议。

2.3 IP 地址与域名

概念	说明	举例
域名	方便人记忆的"名字"，相当于"公司名称"	www.baidu.com
IP 地址	机器在网络中的唯一标识，相当于"公司地址"	192.168.22.33
端口号	同一台机器上不同服务的编号，相当于"公司里的具体部门"	5000、5001

开发阶段： 我们代码中常用 http://127.0.0.1:5001 这样的格式，即 IP 地址 + 端口号，直接用 IP 找到这台机器。

正式上线： 需要购买域名，域名会通过 DNS 解析到对应的 IP 地址，然后找到这台机器。用户只需记住域名，不需要记 IP 地址。

127.0.0.1 是一个特殊地址，表示"本机"，等价于 localhost。

2.4 GET 请求与 POST 请求

HTTP 协议定义了多种请求方法，其中最常用的是 GET 和 POST。

（1）GET 请求

• 用途： 用来获取资源，就像你在浏览器地址栏输入网址访问页面一样。
• 举例： 访问 https://www.baidu.com/s?wd=python，就是通过 GET 请求把 python 这个关键词传给百度，然后拿到搜索结果。
• 参数位置： 参数附在 URL 中，以 ?key=value&key2=value2 的形式传递。
• 安全性： 参数直接暴露在 URL 中，不适合传输敏感信息（如密码）。
• 数据大小限制： 有限制，通常为 2K~8K 字节（不同浏览器和服务器有差异）。

（2）POST 请求

• 用途： 用来提交数据，常见于表单提交、登录注册、上传文件。
• 举例： 在网页上填完用户名和密码点"登录"，浏览器会把数据通过 POST 请求发送给服务器。
• 参数位置： 参数放在请求体（body） 中，不会显示在 URL 里。
• 安全性： 相对更安全，但仍需配合 HTTPS 才能真正加密传输。
• 数据大小限制： 理论上无限制，可以传输大文件。

（3）GET 与 POST 对比总结

对比维度	GET 请求	POST 请求
主要用途	获取数据（查询、展示）	提交数据（表单、上传、下单）
参数位置	URL 中（?key=value）	请求体（body）
安全性	不适合传输敏感信息	相对更安全，但需配合 HTTPS
数据大小限制	有限制（通常 2K~8K 字节）	理论上无限制，可传输大文件
常见场景	搜索、查询、页面访问	登录、注册、支付、上传
幂等性	是（多次请求结果相同）	否（多次请求可能产生不同结果）
缓存	可被浏览器缓存	默认不会被缓存

补充------什么是 HTTPS？ HTTPS 是 HTTP 的安全版本，在 HTTP 的基础上加了 SSL/TLS 加密层。数据在传输过程中会被加密，即使被截获也无法被轻易读取。现在大部分网站都使用 HTTPS。

2.5 常见 HTTP 状态码

服务器返回响应时，会附带一个状态码，告诉客户端请求的处理结果：

状态码	含义	说明
200	OK	请求成功
301	Moved Permanently	资源永久重定向
302	Found	资源临时重定向
400	Bad Request	请求参数有误
401	Unauthorized	未认证（未登录）
403	Forbidden	无权限访问
404	Not Found	资源不存在
500	Internal Server Error	服务器内部错误

---

三、JSON 数据格式

3.1 JSON 是什么

JSON，全称 JavaScript Object Notation ，是一种轻量级的数据交换格式。它是客户端和服务器之间传递数据的通用格式------不管服务器用什么语言开发（Python、Java、Go 等），都可以用 JSON 来交换数据。

3.2 JSON 基本语法

JSON 看起来很像字典或表格，用键值对表示数据。

基本结构：

{
  "name": "小明",
  "age": 18,
  "isStudent": true
}

支持嵌套数组：

{
  "class": "三年二班",
  "students": [
    {
      "name": "小明",
      "age": 18
    },
    {
      "name": "小红",
      "age": 19
    },
    {
      "name": "张老师",
      "age": 35
    }
  ]
}

JSON 的语法规则：

规则	说明
数据以键值对形式存储	"key": "value"
键必须用双引号包裹	不能用单引号
值的类型	字符串、数字、布尔值（true/false）、null、数组、对象
数据之间用逗号分隔	最后一个键值对后不加逗号
花括号 {} 表示对象	方括号 [] 表示数组

注意： JSON 看起来像 Python 中的字典，但 JSON 通常是字符串格式 的。Python 的 True/False 在 JSON 中是 true/false（小写）。

3.3 JSON 与 Python 字典的互相转换

Python 内置的 json 库提供了 JSON 字符串和字典之间的互相转换功能。

字典 → JSON 字符串（序列化）：

import json

# 字典 -> JSON 字符串
data = {"name": "小明", "age": 18}
json_str = json.dumps(data, ensure_ascii=False)
print(json_str)        # 输出: {"name": "小明", "age": 18}
print(type(json_str))  # 输出: <class 'str'>

说明： ensure_ascii=False 参数可以保证中文正常显示，否则中文会被转义为 Unicode 编码（如 \u5c0f\u660e）。

JSON 字符串 → 字典（反序列化）：

import json

# JSON 字符串 -> 字典
json_str = '{"name": "小明", "age": 18}'
back_to_dict = json.loads(json_str)
print(back_to_dict["name"])   # 输出: 小明
print(type(back_to_dict))     # 输出: <class 'dict'>

写入和读取 JSON 文件：

import json

# 写入 JSON 文件
data = {"name": "小明", "age": 18}
with open("data.json", "w", encoding="utf-8") as f:
    json.dump(data, f, ensure_ascii=False, indent=4)

# 读取 JSON 文件
with open("data.json", "r", encoding="utf-8") as f:
    loaded_data = json.load(f)
    print(loaded_data)  # 输出: {'name': '小明', 'age': 18}

json 模块常用函数总结：

函数	作用	方向
json.dumps()	字典 → JSON 字符串	序列化
json.loads()	JSON 字符串 → 字典	反序列化
json.dump()	字典 → 写入 JSON 文件	序列化到文件
json.load()	从 JSON 文件读取 → 字典	从文件反序列化

---

四、Flask 框架

4.1 Flask 简介

Flask 是一个用 Python 编写的轻量级 Web 应用框架 ，具有简单、灵活、可扩展的特点。它采用模块化设计，核心非常精简，适合快速构建原型和中小型应用。

补充------Flask 与 Django 的区别： Flask 是"微框架"，只提供核心功能（路由、请求处理等），其他功能通过扩展实现；Django 是"全功能框架"，自带 ORM、Admin 后台、模板引擎等。Flask 更轻量灵活，Django 更适合大型项目。

4.2 安装 Flask

使用 pip 安装：

pip install flask 

安装完成后可以验证：

python -c "import flask; print(flask.__version__)" 

4.3 Flask 基本使用------服务器端

以下是一个完整的 Flask 服务器端示例，接收 POST 请求并返回处理后的 JSON 数据：

from flask import Flask, request, jsonify

# 0. 定义 Flask app
app = Flask(__name__)

# 1. 设置路由
# rule: 路由路径，客户端访问 http://127.0.0.1:5000/flask_post_json_demo
# methods: 指定请求方式为 POST
@app.route(rule='/flask_post_json_demo', methods=['POST'])
def flask_post_json_demo():
    # 2. 获取从客户端传递过来的 JSON 数据（自动解析为字典）
    json_data = request.get_json()

    # 3. 进行数据处理
    json_data["name"] = json_data.get("name", "") + "先生"
    json_data["age"] = json_data.get("age", 0) + 8
    json_data["gender"] = "男"

    # 4. 将处理后的数据以 JSON 的形式返回给客户端
    return jsonify(json_data)

# 5. 启动服务器
# host='0.0.0.0' 表示允许其他电脑的客户端访问（不仅限于本机）
# port=5000 指定端口号
# debug=True 开启调试模式（开发阶段建议开启，上线时关闭）
if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

代码逐行解释：

代码	说明
Flask(__name__)	创建 Flask 应用实例
@app.route(...)	装饰器，定义 URL 路径和请求方式
request.get_json()	从请求体中获取 JSON 数据并自动解析为 Python 字典
jsonify()	将 Python 字典转换为 JSON 格式的响应
app.run(...)	启动服务器，监听指定的主机和端口

4.4 Flask 基本使用------客户端调用

客户端使用 Python 的 requests 库向服务器发送请求：

import requests

# 客户端向服务器发送 POST 请求，传递 JSON 数据
response = requests.post(
    "http://127.0.0.1:5000/flask_post_json_demo",
    json={"name": "小明", "age": 18}
)

# 获取从服务器返回的 JSON 数据，并自动转为字典格式
print(response.json())
# 输出: {'name': '小明先生', 'age': 26, 'gender': '男'}

说明： requests.post() 中的 json 参数会自动将字典序列化为 JSON 字符串并设置正确的 Content-Type 请求头。

4.5 Flask 路由与请求方式

路由（Route） 就是 URL 路径和处理函数之间的映射关系。当客户端访问某个 URL 时，Flask 会根据路由找到对应的函数来处理请求。

from flask import Flask, request, jsonify

app = Flask(__name__)

# GET 请求路由
@app.route('/hello', methods=['GET'])
def hello():
    return "Hello, World!"

# POST 请求路由
@app.route('/submit', methods=['POST'])
def submit():
    data = request.get_json()
    return jsonify(data)

# 同时支持 GET 和 POST
@app.route('/both', methods=['GET', 'POST'])
def both():
    if request.method == 'GET':
        return "这是 GET 请求"
    elif request.method == 'POST':
        return "这是 POST 请求"

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

获取请求参数的不同方式：

方法	适用场景	示例
request.args.get('key')	获取 GET 请求 URL 中的参数	/search?wd=python
request.get_json()	获取 POST 请求体中的 JSON 数据	{"name": "小明"}
request.form.get('key')	获取 POST 表单数据	username=xiaoming

4.6 GET 请求示例

服务器端：

from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route('/search', methods=['GET'])
def search():
    # 获取 URL 中的查询参数，如 /search?keyword=python
    keyword = request.args.get('keyword', '')

    # 模拟查询结果
    results = {
        "keyword": keyword,
        "results": [f"结果1：{keyword}入门教程", f"结果2：{keyword}实战项目"]
    }

    return jsonify(results)

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

客户端调用：

import requests

# GET 请求，参数直接拼在 URL 后面
response = requests.get("http://127.0.0.1:5000/search?keyword=python")
print(response.json())
# 输出: {'keyword': 'python', 'results': ['结果1：python入门教程', '结果2：python实战项目']}

4.7 POST 请求示例

服务器端：

from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route('/login', methods=['POST'])
def login():
    # 获取客户端发送的 JSON 数据
    data = request.get_json()
    username = data.get('username', '')
    password = data.get('password', '')

    # 模拟登录验证
    if username == 'admin' and password == '123456':
        return jsonify({"status": "success", "message": "登录成功"})
    else:
        return jsonify({"status": "fail", "message": "用户名或密码错误"})

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

客户端调用：

import requests

response = requests.post(
    "http://127.0.0.1:5000/login",
    json={"username": "admin", "password": "123456"}
)
print(response.json())
# 输出: {'status': 'success', 'message': '登录成功'}

4.8 返回 JSON 数据

Flask 中使用 jsonify() 函数返回 JSON 格式的响应：

from flask import Flask, jsonify

app = Flask(__name__)

@app.route('/user_info', methods=['GET'])
def user_info():
    data = {
        "name": "小明",
        "age": 18,
        "hobbies": ["编程", "篮球", "阅读"]
    }
    # jsonify 会自动设置 Content-Type 为 application/json
    return jsonify(data)

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

补充------jsonify() 和 json.dumps() 的区别： jsonify() 返回的是一个 Flask 的 Response 对象，自动设置了正确的 Content-Type 响应头（application/json）；而 json.dumps() 只是将字典转为 JSON 字符串，不会自动设置响应头。在 Flask 中推荐使用 jsonify()。

---

以上就是 Flask Web 开发的基础知识梳理，涵盖了客户端-服务器架构、HTTP 协议、JSON 数据格式以及 Flask 框架的核心用法。