本项目由本人设计，通过借用企业4090服务器、为远程网页端使用comfyui搭建。（详细代码见下方）一、 系统架构概览整个应用可以看作一个调度中心和文件传输中介，它的核心工作流如下：前端交互：用户在Windows的网页界面上传视频和图片。文件同步：应用将文件从Windows本地上传至Linux服务器的指定目录。任务触发：应用向Linux服务器上的ComfyUI服务发送API请求，启动AI生成工作流。结果拉取：应用轮询任务状态，完成后将生成的视频文件从Linux服务器下载回Windows本地。结果展示：在网页上播放最终视频，并管理生成历史。二、 核心技术栈与知识点拆解1. Web应用框架：Gradio作用：快速构建机器学习模型的演示界面。本代码用它构建了整个用户交互前端。关键实现：gr.Blocks(): 提供了更灵活的布局能力，支持行(gr.Row)、列(gr.Column)、标签页(gr.Tabs)等组件。组件丰富：使用了gr.Video（视频上传/播放）、gr.Image（图片上传）、gr.Dataframe（历史记录表格）、gr.State（会话状态存储）等多种组件。事件驱动：通过.click()、.select()、.load()方法将前端组件与后台Python函数绑定。2. 跨系统文件传输：Paramiko (SFTP)作用：实现Windows客户端与Linux服务器之间的安全文件传输。核心类：SFTPManager这是一个上下文管理器（实现了__enter__和__exit__方法），使用with SFTPManager() as sftp:语法，确保SSH连接和SFTP会话在使用后能被自动、安全地关闭，避免了资源泄漏。它封装了连接 (ssh.connect)、打开SFTP通道 (open_sftp)、文件上传 (sftp.put) 和下载 (sftp.get) 等操作。3. 远程AI服务调用：ComfyUI API作用：与后端AI工作流引擎交互。关键流程：加载工作流模板：从本地的workflow.json文件读取ComfyUI的工作流定义。动态注入参数：将用户上传的视频、图片在服务器上的路径，替换到工作流模板的特定节点（如节点1,45,35）的输入中。触发执行：向http://{LINUX_IP}:8188/prompt发送POST请求，提交修改后的工作流JSON。ComfyUI会返回一个prompt_id用于追踪本次任务。轮询结果：通过get_output_from_history函数，不断查询http://{LINUX_IP}:8188/history/{prompt_id}，直到在输出中找到生成的视频文件路径。4. 文件与路径管理本地与远程目录映射：代码清晰地定义了Windows和Linux两套路径。WINDOWS_UPLOAD_DIR,WINDOWS_OUTPUT_DIR用于本地存储。LINUX_UPLOAD_DIR,LINUX_OUTPUT_DIR对应服务器上的目录。唯一文件名生成：generate_filename函数通过“前缀时间戳随机码.后缀”的格式（如videos_20250217123045_abc123.mp4）确保文件不重名，避免覆盖。递归创建远程目录：create_remote_dir函数通过尝试获取路径状态(sftp.stat)和捕获FileNotFoundError异常，实现了在服务器上递归创建不存在的目录。5. 用户系统实现方式：轻量级的基于文件的用户认证。数据存储：使用JSON文件 (users.json) 存储用户名和密码（明文存储，生产环境需加密）。功能：提供了登录和注册两个标签页，对应handle_login和handle_register函数。登录成功后，通过更新Gradio组件的visible属性，隐藏登录界面，显示主功能界面。6. 历史记录与预览本地索引：get_video_history函数扫描WINDOWS_OUTPUT_DIR目录，按文件创建时间倒序排列，返回文件名、时间和路径的列表，并展示在Dataframe组件中。交互预览：为Dataframe绑定了select事件。当用户点击历史记录中的某一行时，preview_history函数会被触发，提取对应的文件路径并更新下方的gr.Video组件，实现即时播放。7. 前端样式定制CSS深度定制：通过gr.Blocks的css参数注入大段自定义CSS，实现了超出Gradio默认主题的界面美化。关键样式：黑框容器​ (.black-box)：为各个功能区域添加了统一的带阴影的黑色边框。响应式设计：使用@media查询，使视频播放区域在不同屏幕尺寸下自适应。状态提示：定义了success和error类，用于登录注册的成功/失败消息提示。三、 核心函数执行流程串联当用户点击“开始生成”按钮时，代码的执行顺序如下：handle_submit(video, img1, img2)被调用。调用三次handle_upload(file_path, file_type)，分别处理视频、图1、图2：a. 在Windows本地创建uploads/videos/或uploads/images/目录。b. 生成唯一文件名，将临时文件移动至本地目录。c. 通过SFTPManager将文件上传至Linux服务器的对应目录。d. 返回文件在服务器上的远程路径。调用process_generation(video_remote_path, img1_remote_path, img2_remote_path)：a. 加载workflow.json。b. 将三个远程路径填入工作流JSON的指定节点。c. 向ComfyUI服务器发送API请求，触发工作流执行，获得prompt_id。d. 调用get_output_from_history(prompt_id)，轮询历史记录，直到生成完成并获取到视频在服务器的最终路径。e. 再次通过SFTPManager，将服务器上的结果视频下载到Windows的outputs/目录。f. 返回视频在Windows本地的路径。Gradio将返回的本地视频路径赋值给output_video组件，网页自动播放视频。同时，更新history_table组件，新的生成记录出现在历史列表顶部。四、 总结与潜在优化点这份代码是一个优秀的全栈概念验证(PoC)项目，它巧妙地串联起了：前端​ (Gradio UI)文件同步​ (Paramiko SFTP)后端服务调用​ (HTTP API to ComfyUI)状态管理​ (轮询、本地文件索引)可优化或注意的方面：