使用FastAPI构建后端服务 响应前端post请求

FastAPI

1. FastAPI 是基于 Python 3.8+ 的高性能 Web 框架，主打 API 开发，兼容 OpenAPI（Swagger）和 JSON Schema 规范。

2. 核心优势：异步支持（基于 Starlette）、自动生成交互式文档、类型注解驱动（Pydantic 校验数据）、性能接近 Node.js/Go。

3. 核心特性：路由装饰器（@app.get/post）定义接口、Pydantic 模型做请求 / 响应校验、依赖注入简化逻辑复用。

4. 基础用法：定义路由函数 + 类型注解，框架自动处理参数解析、校验、文档生成，启动仅需 uvicorn 运行入口文件。

5. 适用场景：快速开发高性能 REST API，支持前后端分离、微服务，易部署且生态完善。

简单实例(上接)

前端:

1. 整体逻辑：前端（VSCode 开发）→ axios 发送 POST 请求 → FastAPI 服务端（PyCharm 开发）接收并响应，是前后端分离的基础交互模式。

2. 前端操作：VSCode 创建 HTML/JS 页面，引入 axios 库，通过axios.post(服务端地址, 请求数据) 构造 POST 请求，指定 FastAPI 绑定的 IP + 端口。

   axios.post('http://127.0.0.1:8000/a', userData)
         .then(function (response) {
           // 请求成功
           console.log('响应数据:', response.data);
           // 弹出验证数据的提醒
           alert(`注册请求成功！\n\n提交的数据:\n用户名: ${userData.username}\n密码: ${userData.password}\n手机号: ${userData.tel}\n\n响应状态: ${response.status}\n响应数据: ${JSON.stringify(response.data, null, 2)}`);
           // 模拟处理响应
           setTimeout(function () {
             if (response.data.success) {
               alert("注册成功");
             } else {
               alert("注册失败");
             }
           }, 1000);
         })

3. 服务端前提：FastAPI 需在 PyCharm 中编写接口（如@app.post("/接口路径")），启动服务并绑定可被前端访问的地址（如127.0.0.1:8000），确保跨域配置（CORS）。

后端:

1. 跨域配置：FastAPI 需通过CORSMiddleware中间件配置允许的源、方法、请求头，解决浏览器跨域限制，是前端正常访问的前提；

   # 配置跨域资源共享 (CORS) 中间件
   # 允许指定的源地址访问 API，支持携带凭证，并限制允许的 HTTP 方法和请求头
   app.add_middleware(
       CORSMiddleware,  # CORS 中间件类
       allow_origins=[  # 允许的源地址列表(外部地址)
           "http://localhost:5500",
           "http://127.0.0.1:5500",
       ],
       allow_credentials=True,  # 允许携带凭证
       allow_methods=["GET", "POST", "PUT", "DELETE", "OPTIONS"],  # 允许的 HTTP 方法列表
       allow_headers=["Content-Type", "Authorization"],  # 允许的请求头列表
   )

2. 异步处理：FastAPI 天然支持异步，接口函数定义为async def，可异步接收前端请求数据（如 JSON / 表单），避免阻塞提升性能；

3. 数据处理：异步获取数据后，按业务逻辑判断（如参数校验、条件筛选），最终通过return返回结构化数据（如 JSON）给前端。

效果

! 每次更改后重启服务

# fastapi构建服务端

import json
from fastapi import FastAPI
from fastapi import Response, Request
import uvicorn
from fastapi.middleware.cors import CORSMiddleware
from fastapi.responses import JSONResponse

# 创建web框架实例
app = FastAPI()

# 配置 CORS 允许跨域访问
app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],  # 允许所有来源，生产环境建议指定具体域名
    allow_credentials=True,  # 允许携带 cookie
    allow_methods=["*"],  # 允许所有 HTTP 方法
    allow_headers=["*"],  # 允许所有 HTTP 头
)


# 将 HTTP post 请求的 /a 路径，绑定到下方定义的处理函数；
# 当客户端访问 域名/a 并发起 post 请求时，会执行该装饰器关联的函数并返回结果；
@app.post("/a")
async def post_register(request: Request):
    # 获取前端发送的请求体数据
    body = await request.json()
    # 获取usernme值
    username = body.get("username")

    # 也可使用JSONResponse自动处理json格式数据
    # if username == "testuser":
    #     return JSONResponse(
    #         content={"success": True, "message": "注册成功"}, status_code=200
    #     )
    # return JSONResponse(
    #     content={"success": False, "message": f"用户名 {username} 不符合要求"},
    #     status_code=400,
    # )

    if username == "testuser":
        data = {"success": True, "message": "注册成功", "status": 200}
    else:
        data = {
            "success": False,
            "message": f"用户名 {username} 不符合要求",
            "status": 400,
        }
    # 响应数据 将dict格式转为json格式
    return Response(json.dumps(data), media_type="application/json")


# 修改之后重新运行
if __name__ == "__main__":
    # uvicorn 一款用于运行 ASGI(异步服务器网关接口) 应用的高性能 Python Web 服务器
    uvicorn.run(app, host="127.0.0.1", port=8000)