平时我们写Python脚本处理数据很爽，但一想到要把成果做成Web页面展示给别人，脑子里立刻嗡嗡作响：还得学HTML、CSS、JavaScript，甚至还要折腾前后端通信？
其实，如果你只是想快速搭建一个交互式的Web应用，完全可以避开这些繁琐的前端技术栈。今天给大家介绍一个非常硬核且极度友好的Python库——Drafter。它最初是为计算机科学基础教育设计的，主打一个“全栈Web开发，只需纯Python”。没有繁琐的模版语言，没有复杂的全局状态，甚至连部署都不需要独立的后端服务器。
为什么选择 Drafter？
彻底告别前端代码：网页上的按钮、文本框、图片全是通过Python函数直接调用的（例如使用 Button(), TextBox()），拿来即用。
极简的状态管理：抛弃复杂的 Redux 或 Vuex，你可以直接用 Python 原生的 dataclass、字典或者列表来作为整个网页的数据模型。
纯函数式路由：每个页面的逻辑就是一个普通的Python函数。它接收当前的数据状态，并返回一个包含了新状态和页面组件的 Page 对象。
支持纯前端部署：写出来的网站可以直接挂在 GitHub Pages 上运行（底层通过 Skulpt 在浏览器里直接跑 Python 代码），零成本上线。
Drafter 是如何工作的？
Drafter 的运行机制非常干净，核心理念就是“数据驱动视图”。我们可以通过下面这张流程图来看看它是如何处理用户交互的：
graph TD A[用户在浏览器操作: 点击按钮/提交输入] --> B(触发 Drafter 对应的路由函数) B --> C{读取当前的 State 状态} C --> D[执行纯 Python 业务逻辑与计算] D --> E[更新 State 数据] D --> F[生成新的界面 Components 组件] E --> G[打包封装为 Page 对象返回] F --> G G --> H[浏览器刷新并渲染全新页面]
实战演示：用纯代码搭建交互页面
我们要多看代码才能体会到它的优雅。假设我们在处理GF-3雷达卫星数据，需要给团队做一个简单的Web小工具：大家只要输入站点名称（比如巴彦淖尔）和该站点专属的粗糙度参数，就能动态展示该站点的土壤水分反演结果概览。我们直接用 Drafter 来实现这个需求。
首先，看一个最基础的起手式，教你如何让网页跑起来：
from drafter import *# @route 装饰器将普通函数变成网页路由@routedef index(state: None): # 返回 Page 对象，包含状态和网页内容 return Page(state, [ Header("GF-3 雷达数据处理中心"), "欢迎使用土壤水分反演控制台！" ])# 启动本地服务器start_server()
但这还不够，我们需要真实的交互。接下来，我们加入状态管理（State）和表单组件（Components），完成反演逻辑的数据传递。
from drafter import *from dataclasses import dataclass# 定义网页的状态模型，这就像是前端的响应式数据@dataclassclass StationState: station_name: str roughness_param: float result_message: str# 网站的主页路由@routedef index(state: StationState): # 如果是第一次访问，初始化站点的默认状态 if state is None: state = StationState("巴彦淖尔", 0.0, "等待计算...") # 构建页面内容，全是纯 Python 对象 content = [ Header("单站点土壤水分反演系统"), "我们在分析 2023-2024 年的影像数据时，每个观测站点都有其独立的粗糙度。请在下方输入参数：", LineBreak(), "站点名称：", TextBox(name="station_input", value=state.station_name), LineBreak(), "该站点的地表粗糙度：", TextBox(name="roughness_input", value=str(state.roughness_param)), LineBreak(), # 绑定点击事件，点击后会跳转到 calculate_moisture 路由 Button("运行反演模型", url="calculate_moisture"), LineBreak(), # 结果展示区 Header("计算结果："), PreformattedText(state.result_message) ] return Page(state, content)# 处理按钮点击计算逻辑的路由@routedef calculate_moisture(state: StationState, station_input: str, roughness_input: str): # 从表单组件(根据 name 属性)接收输入，并更新状态 state.station_name = station_input try: roughness = float(roughness_input) state.roughness_param = roughness # 模拟调用 AIEM / WCM 模型的过程 # 实际开发中，这里可以直接调用你现有的 Python 数据处理脚本 simulated_mv = 15.2 + (roughness * 2.1) state.result_message = ( f"目标站点: {state.station_name}\n" f"使用的粗糙度参数: {roughness}\n" f"-> 估算土壤水分 (mv): {simulated_mv:.2f} %\n" f"系统提示：该站点已成功完成 2023-2024 影像时间序列匹配。" ) except ValueError: state.result_message = "输入错误：粗糙度必须是有效数字！" # 计算完成后，带着更新后的 state 重新渲染 index 页面 return index(state)# 启动服务start_server()
写在最后
你发现了吗？上面的整个过程没有任何 HTML 标签，也没有复杂的 JavaScript 异步回调逻辑。@dataclass 直接把页面的数据结构化了，当点击按钮时，表单里的数据会自动作为参数传给对应的处理函数，计算完之后更新 State，再重新调用渲染页面的函数就一切搞定了。
对于经常写数据分析、自动化脚本的人来说，Drafter 的这种“纯函数式 + 数据驱动”的设计简直顺理成章。你可以把平时写的出图函数、复杂的算法逻辑直接塞进去，套个 Drafter 的壳子，几分钟就能变身成一个有模有样的内部交互工具。
Drafter 虽然不是用来开发大型商业级复杂网页的，但如果你想快速做个原型、给自己的脚本加个图形界面，或者用于向团队展示算法成果，它绝对是一个值得放入你代码工具箱的神兵利器。直接打开终端 pip install drafter 跑起来试试看吧！
编辑：余文彬
审校：余雨馨
10个月宝宝每天需要喝多少奶粉？
