gradio快速入门

gradio是一个web ui框架主要用于验证大模型应用开发出来的效果咋样课程目标用 Gradio 将 Python 函数、机器学习模型或大模型 API 快速包装成可交互的 Web 页面方便验证效果、演示和临时分享。一、Gradio 是什么Gradio 是 Hugging Face 生态中的开源 Python 库。它将函数参数映射为输入组件将函数返回值映射为输出组件因此不需要编写前端代码也能快速完成 Demo。适用场景算法原型、模型效果验证、内部演示、API 调试。典型项目ChatGLM2-6B、gpt_academic、stable-diffusion-webui。核心关系Python 函数 输入组件 输出组件 可交互 Web 页面。二、为什么使用 Gradio模型、API 和普通 Python 函数都能直接获得图形化界面。设置shareTrue可生成临时公网地址课程中说明有效期约为 72 小时。非常适合快速验证不必先投入时间开发完整前端。三、快速入门文本反转import gradio as gr def reverse_text(text): return text[::-1] demo gr.Interface( fnreverse_text, inputs“text”, outputs“text” ) demo.launch(shareTrue)参数对应关系参数含义注意点fn要执行的 Python 函数不要写成函数调用结果inputs输入组件数量与顺序应对应函数形参outputs输出组件数量与顺序应对应返回值share是否生成公网链接应使用布尔值True不要写成字符串课堂中的问候函数示例import gradio as gr def hellotoPerson(name): return “你好” name demo gr.Interface( fnhellotoPerson, inputs“text”, outputs“text” ) demo.launch()四、多输出与界面信息配置下面的函数同时返回“反转后的文本”和“字符数”所以outputs需要配置两个组件。import gradio as gr def reverse_and_count(text): reversed_text text[::-1] length len(text) return reversed_text, length demo gr.Interface( fnreverse_and_count, inputs“text”, outputs[“text”, “number”], title“文本处理工具”, description“输入一段文字查看其倒序形式及字符数。”, examples[[“你好世界”], [“Hello World”]], flagging_mode“never” ) demo.launch()title页面标题。description功能说明。examples可点击并快速填充的示例。flagging_mode“never”关闭 Flag 标记功能。五、完整案例图片转铅笔画处理流程灰度化 → 像素取反 → 高斯模糊 → 再次取反 → 颜色减淡计算。import gradio as gr import numpy as np import cv2 def image_to_sketch(image): gray_image image.convert(“L”) inverted_image 255 - np.array(gray_image) blurred cv2.GaussianBlur(inverted_image, (21, 21), 0) inverted_blurred 255 - blurred pencil_sketch cv2.divide( np.array(gray_image), inverted_blurred, scale256.0 ) return pencil_sketch demo gr.Interface( fnimage_to_sketch, inputs[gr.Image(label“上传图片”, type“pil”)], outputs[gr.Image(label“输出图”)], title“图像转铅笔画”, description“将上传的图片转为铅笔画。” ) demo.launch()关键点type“pil”使回调函数接收到 PIL Image 对象label用于修改组件在页面中的显示名称。六、完整案例接入通义千问 qwen-max课程通过 DashScope 的 OpenAI 兼容接口调用qwen-max并兼容 Gradio 新旧两种历史消息结构。import gradio as gr import os from openai import OpenAI api_key os.getenv(“DASHSCOPE_API_KEY”) def call_qwen(message, history): # 未设置密钥时直接返回提示避免继续发起请求 if not api_key: return “错误未设置 DASHSCOPE_API_KEY 环境变量请设置后重试。” client OpenAI( api_keyapi_key, base_url“https://dashscope.aliyuncs.com/compatible-mode/v1” ) messages [] # 兼容新版字典格式和旧版二元组格式的聊天历史 if history: try: for msg in history: if ( isinstance(msg, dict) and “role” in msg and “content” in msg ): messages.append(msg) elif isinstance(msg, (list, tuple)) and len(msg) 2: user_msg, assistant_msg msg messages.append({ “role”: “user”, “content”: user_msg }) messages.append({ “role”: “assistant”, “content”: assistant_msg }) except Exception as e: print(f处理历史记录时出错{e}) messages.append({“role”: “user”, “content”: message}) try: response client.chat.completions.create( model“qwen-max”, messagesmessages, streamFalse ) return response.choices[0].message.content except Exception as e: return Error: str(e) demo gr.ChatInterface( fncall_qwen, title“通义千问-max”, description“基于通义千问 max 的聊天机器人”, examples[ [“你好”], [“你叫什么名字”], [“给我讲一个笑话呀”] ] ) ifname “main”: demo.launch(themegr.themes.Soft())聊天示例的执行流程从环境变量读取DASHSCOPE_API_KEY。把 Gradio 的历史消息转换为 OpenAI 接口要求的messages字典列表。追加用户当前输入。调用client.chat.completions.create()。返回response.choices[0].message.content交给聊天组件展示。七、容易出错的细节布尔值使用shareTrue不要写成share“True”。切片语法反转字符串是text[::-1]中间是两个冒号。组件类型图片案例使用gr.Image(type“pil”)否则函数接收的数据类型可能不同。消息格式聊天历史可能是字典列表也可能是二元组列表应分别处理。密钥安全API Key 只从环境变量读取不要硬编码到源码或上传仓库。版本差异Gradio 更新较快如参数报错应先核对本地版本和对应文档。公网链接shareTrue适合临时演示不替代正式生产部署。八、总结先写好处理函数再用 Interface 或 ChatInterface 描述输入与输出。Gradio 的价值在于把模型能力快速变成“可看、可点、可分享”的应用页面。