openui

构建UI组件可以是一个口号。 openui旨在使过程变得有趣，快速和灵活。这也是我们在W＆B上使用的工具来测试和原型我们的下一代工具，用于在LLM上构建强大的应用程序。

openui让您使用您的想象力来描述UI，然后看到它现场直播。您可以要求更改，并将HTML转换为React，Svelte，Web组件等。它就像V0，但开源，而不是像抛光的?。

尝试演示

openui支持OpenAI，Groq和任何模型Litellm支持Gemini或Anthropic（Claude）。以下环境变量是可选的，但需要在您的环境中设置以使替代模型工作：

• OpenAi OpenAi_API_KEY
• groq groq_api_key
• 双子座Gemini_api_key
• 拟人phastic_api_key
• cohere cohere_api_key
• mistral mistral_api_key
• OpenAi兼容OpenAi_compatible_endpoint和OpenAi_compatible_api_key

例如，如果您正在运行像Localai这样的工具，则可以设置OpenAi_compatible_endpoint，并且可以选择地将OpenAI_Compatible_api_key设置为将UI型型号选择器中列出的型号在litellm下列出。

您也可以使用Ollama可用的型号。安装Ollama并拉出Llava之类的模型。如果Ollama在http://127.0.0.1:11434上没有运行，则可以将Ollama_Host环境变量设置为Ollama实例的主机和端口。例如，在Docker中运行时，您需要指向http：//host.docker.internal：11434，如下所示。

以下命令将从您的Shell环境中转发指定的API键，并告诉Docker使用计算机上运行的Ollama实例。

 export ANTHROPIC_API_KEY=xxx
export OPENAI_API_KEY=xxx
docker run --rm --name openui -p 7878:7878 -e OPENAI_API_KEY -e ANTHROPIC_API_KEY -e OLLAMA_HOST=http://host.d***ocker.internal:11434 ghcr.io/wandb/openui

现在，您可以将http：// localhost：7878获取并生成新的UI！

假设您已安装了git和紫外线：

git clone https://githu**b.*com/wandb/openui
cd openui /backend
uv sync --frozen --extra litellm
source .venv/bin/activate
# Set API keys for any LLM's you want to use
export OPENAI_API_KEY=xxx
python -m openui 

LITELLM可用于基本上连接到任何可用的LLM服务。我们根据您的环境变量自动生成配置。您可以创建自己的代理配置来覆盖此行为。我们在以下位置寻找自定义配置：

1. 当前目录中的litellm-config.yaml
2. /app/litellm-config.yaml在码头容器中运行时
3. 由openui _litellm_config环境变量指定的任意路径

例如，要在Docker中使用自定义配置，您可以运行：

docker run -n openui -p 7878:7878 -v $( pwd ) /litellm-config.yaml:/app/litellm-config.yaml ghcr.io/wandb/ openui

要运行的源头使用Litellm：

pip install .[litellm]
export ANTHROPIC_API_KEY=xxx
export OPENAI_COMPATIBLE_ENDPOINT=http://l**oca*lhost:8080/v1
python -m openui --litellm

要使用超快速Groq型号，请将GROQ_API_KEY设置为您可以在此处找到的GROQ API密钥。要使用GROQ型号之一，请单击NAV栏中的设置图标。

免责声明：这可能会非常慢。如果您有GPU，则可能需要将Ollama容器的标签更改为支持它的容器。如果您在Mac上运行，请按照上面的说明进行操作，并在本地运行Ollama以利用M1/M2。

您可以从根目录中运行：

docker-compose up -d
docker exec -it openui -ollama-1 ollama pull llava

如果您已经在环境中设置了OpenAI_API_KEY，则只需从OpenAI_API_KEY行删除= XXX即可。您还可以将上述命令中的Llava替换为开源模型（Llava是当前支持图像的唯一Ollama型号之一） 。现在，您应该能够通过http：// localhost：7878访问openui 。

如果您更改前端或后端，则需要运行Docker-Compose构建以使它们在服务中反映。

在此存储库中配置了DEV容器，这是最快开始的方法。

在创建代码空间时选择更多选项，然后选择“新的”选项...。如果您想要一个非常快的启动时间，请选择美国西部地区。您还需要配置OpenAI_API_KEY秘密，或者如果您想尝试Ollama （至少需要16GB的RAM），则将其设置为XXX。

进入代码空间后，您可以在一个终端运行服务器：Python -M openui -DEV。然后在一个新的终端中：

 cd /workspaces/ openui /frontend
npm run dev

这应该在端口5173上打开另一个服务，这是您要访问的服务。对前端和后端的所有更改都将自动重新加载并反映在您的浏览器中。

CodeSpace安装Ollama自动化并下载了Llava型号。您可以验证Ollama如果失败，打开新的终端并运行Ollama服务。在代码方面，我们将llava拉到启动时，因此您应该在列表中看到它。您可以从应用程序左上角的设置齿轮图标中选择Ollama型号。您拉动的任何型号IE Ollama Pull Llama都会出现在设置模式中。

您可以通过gitpod轻松地使用打开的UI，并通过打开AI进行预配置。

启动时，打开UI自动安装和启动。

在使用GitPod之前：

• 确保您有一个GitPod帐户。
• 使用打开AI模型在GitPod用户帐户中设置OpenAI_API_KEY环境变量。将范围设置为Wandb/ openui （如果您分叉的话）。

注意：其他（本地）模型也可以与较大的GitPod实例类型一起使用。所需的模型未在GITPOD中进行预配置，但可以轻松地如上所述添加。

请参阅前端和后端目录中的重新记录。