不用前端知识，也能快速创建交互友好的机器学习模型Web界面！Gradio快速入门—LLM应用开发与落地，前端与大模型的齐头并进

https://www.gradio.app/

Gradio是一个用于构建机器学习模型的交互式Web界面的Python库。可让我们快速的为机器学习模型、API 或任何任意 Python 函数构建演示或 Web 应用程序。支持用户快速创建自定义的Web界面，比较多的用于展示和测试机器学习模型、自然语言处理模型、计算机视觉模型等。Gradio的优势在于易用性，只需简单定义输入和输出接口即可快速构建简单的交互页面，更轻松部署模型。它支持多种输入和输出类型，包括文本、图像、音频和视频，并且提供了自动化的界面布局和样式。

Gradio可以与Python中的任何库一起使用，如果能够编写Python函数，Gradio就可以运行它。它能够无缝嵌入到Python笔记本中，或者作为Web页面展示。Gradio还支持我们在无JavaScript、CSS 或网络托管经验的情况下，通过 Gradio 的内置共享功能在几秒钟内通过公共链接向伙伴分享我们的演示界面，可以自动生成公共链接，与同事共享，让他们远程与模型交云，而无需自己搭建服务器。

下面图中的效果只需要几行Python就可以搞定，接下来我们来实操试试看

Gradio的优势主要包括以下几点：

易于使用：API设计直观，没有深厚编程背景的用户也能快速上手完成原型开发。

多模态支持：支持多种数据类型的输入和输出，如文本、图像、音频、视频等，能够适应各种机器学习模型的展示需求。

无需前端知识：无需具备JavaScript、CSS或HTML知识即可创建交互式Web界面，Gradio提供了一套完整的前端组件。

内置分享功能：Gradio应用可以轻松地通过公共链接分享，便于与他人协作和获取反馈。

实时交互：Gradio支持实时数据流，可以创建实时交互的应用，如实时音频处理或实时图像生成。

集成Hugging Face Spaces：Gradio可以轻松集成到Hugging Face Spaces，这是目前最主流的机器学习模型托管平台，允许用户免费托管他们的Gradio应用。

跨平台：Gradio应用可以在多种设备和操作系统上运行，无需额外的适配工作。

Gradio的局限有：

自定义和控制有限：对于需要高度自定义的用户界面和复杂交互的应用可能不如其他更专业的Web框架灵活。

性能和规模：对于需要处理大量并发用户或高负载的应用，Gradio可能需要额外的配置和优化。

依赖于Python环境：Gradio应用需要Python环境支持，用户群体得会Python，不过Gradio主要也是给机器学习的大神们快速做原型用的。

首先我们需要安装Python 3.8 或更高版本，建议使用pip安装，它默认包含在 Python 中。在终端或命令提示符中运行此命令：

pip install gradio

很快就成功了，然后我们来尝试构建一个demo!

我们可以在任何我们自己熟悉的代码编辑器中运行Gradio，比如Jupyter 笔记本、Google Colab 或任何我们编写 Python 的编辑器。

我们创建一个app.py的文件，贴上下面的Python代码

import gradio as grdef greet(name, intensity):    return "Hello, " + name + "!" * int(intensity)demo = gr.Interface(    fn=greet,    inputs=["text", "slider"],    outputs=["text"],)demo.launch()

从终端运行 python app.py来运行我们的代码

在我们本地开发时，如果执行的是gradio app.py，则默认是在热重载模式下运行 Gradio 应用程序，我们只要对文件进行更改，就会自动重新加载 Gradio 应用程序。

在第一个demo中我们创建了 gr.Interface 类的实例。 Interface 类旨在为机器学习模型创建演示，该模型接受一个或多个输入并返回一个或多个输出。

Interface 类具有三个核心参数：

inputs：用于输入的 Gradio 组件。组件的数量应与函数中参数的数量相匹配。

outputs：用于输出的Gradio组件。组件的数量应与函数返回值的数量相匹配。

fn 参数非常灵活，我们可以传递任何想要用 UI 包装的 Python 函数，这个函数可以是从音乐生成器到税收计算器再到预训练机器学习模型的预测函数的等等的任何函数。

inputs输入和outputs输出参数采用一个或多个 Gradio 组件。Gradio 包含 30 多个专为机器学习应用程序设计的内置组件(例如 gr.Textbox()、gr.Image() 和 gr.HTML() 组件)。

如果我们像demo一样将输入组件列表传递给inputs输入，那其中的每个输入组件按顺序对应于函数greet的参数之一。同理如果我们的outputs函数返回多个值，则也是一样的按顺序传入。

Gradio可让我们在无需担心托管在 Web 服务器上的麻烦配置就能实现分享。只需在 launch() 中设置 share=True，Gradio就会为我们的演示创建一个可公开访问的 URL。比如我们将最后一行更改如下：

Gradio还提供了多种内置组件，如：

gr.Textbox()：用于接收文本输入

gr.Image()：用于上传和显示图像

gr.HTML()：用于显示HTML内容

此外，Gradio还支持实时界面、流式输入输出、批处理函数、警告模式、样式设置、进度条等功能。比如gr.Blocks的方法来实现定制布局和数据流的能力。Blocks支持例如控制组件在页面上出现的位置、处理多个数据流和更复杂的交互（例如一个函数的输出可以用作另一个函数的输入）以及根据用户交互更新组件的属性/可见性等功能，这些都不用专门写js和css，都是python。

gr.Blocks()可以支持的自定义和复杂的应用程序的构建成都非常深，比如非常有名的stable-diffusion-webui，就是使用Gradio Blocks构建的

Gradio还包括另一个高级类 gr.ChatInterface，这个是专门用于创建聊天机器人 UI的方法。与 Interface 类似，您提供一个函数，Gradio 创建一个完全工作的聊天机器人 UI。我们再来看一个demo

比如我们用random随机返回yes或no来模拟一个LLM的返回

import randomdef random_response(message, history):    return random.choice(["Yes", "No"])

接着我们实现这样一个demo

import gradio as grgr.ChatInterface(random_response).launch()

按照之前说的方法运行，我们就可以看到一个可以与random_response方法对话的聊天页面了

方法还支持多轮对话历史信息传递，这个就先不深入展开，我们先主要了解能力范围！

Gradio是一个由 Python 和 JavaScript 库组成的完整生态系统，可让我们使用 Python 或 JavaScript 构建机器学习应用程序或以编程方式查询它们。下面是 Gradio 生态系统的其他相关部分：

Gradio Python 客户端 (gradio_client)：在 Python 中以编程方式查询任何 Gradio 应用程序。

Gradio JavaScript 客户端 (@gradio/client)：在 JavaScript 中以编程方式查询任何 Gradio 应用程序。

Gradio-Lite (@gradio/lite)：用 Python 编写完全在浏览器中运行的 Gradio 应用程序（不需要服务器！）

Hugging Face Spaces：托管 Gradio 应用程序的最受欢迎的地方 - 免费！

好啦，今天Gradio就介绍到这里，大家跟着操作真的可以分分钟搞出来一个与大模型交互的web页面，掌握了这个技能，之后我们对于任何感兴趣的模型能力都可以快速接入进行尝试了，最关键还能和团队同学一键分享idea，真香！