diff --git a/docs/openapi-servers/open-webui.mdx b/docs/openapi-servers/open-webui.mdx new file mode 100644 index 0000000..7d929c1 --- /dev/null +++ b/docs/openapi-servers/open-webui.mdx @@ -0,0 +1,95 @@ +--- +sidebar_position: 1 +title: "πŸ”— Open WebUI Integration" +--- + +## Overview + +Open WebUI v0.6+ supports seamless integration with external tools via the OpenAPI servers β€” meaning you can easily extend your LLM workflows using custom or community-powered tool servers 🧰. + +In this guide, you'll learn how to launch an OpenAPI-compatible tool server and connect it to Open WebUI through the intuitive user interface. Let’s get started! πŸš€ + +--- + +## Step 1: Launch an OpenAPI Tool Server + +To begin, you'll need to start one of the reference tool servers available in the openapi-servers repo. For quick testing, we’ll use the time tool server as an example. + +πŸ› οΈ Example: Starting the `time` server locally + +```bash +git clone https://github.com/open-webui/openapi-servers +cd openapi-servers + +# Navigate to the time server +cd servers/time + +# Install required dependencies +pip install -r requirements.txt + +# Start the server +uvicorn main:app --host 0.0.0.0 --reload +``` + +Once running, this will host a local OpenAPI server at http://localhost:8000, which you can point Open WebUI to. + +![Time Server](/images/openapi-servers/open-webui/time-server.png) + +--- + +## Step 2: Connect Tool Server in Open WebUI + +Next, connect your running tool server to Open WebUI: + +1. Open WebUI in your browser. +2. Open βš™οΈβ€―**Settings**. +3. Click on βž• **Tools** to add a new tool server. +4. Enter the URL where your OpenAPI tool server is running (e.g., http://localhost:8000). +5. Click "Save". + +![Settings Page](/images/openapi-servers/open-webui/settings.png) + +--- + +## Step 3: Confirm Your Tool Server Is Connected βœ… + +Once your tool server is successfully connected, Open WebUI will display a πŸ‘‡ tool server indicator directly in the message input area: + +πŸ“ You'll now see this icon below the input box: + +![Tool Server Indicator](/images/openapi-servers/open-webui/message-input.png) + +Clicking this icon opens a popup where you can: + +- View connected tool server information +- See which tools are available and which server they're provided by +- Debug or disconnect any tool if needed + +πŸ” Here’s what the tool information modal looks like: + +![Tool Info Modal Expanded](/images/openapi-servers/open-webui/info-modal.png) + + +--- + +## Need More Tools? Explore & Expand! 🧱 + +The openapi-servers repo includes a variety of useful reference servers: + +- πŸ“‚ Filesystem access +- 🧠 Memory & knowledge graphs +- πŸ—ƒοΈ Git repo browsing +- 🌎 Web search (WIP) +- πŸ›’οΈ Database querying (WIP) + +You can run any of these in the same way and connect them to Open WebUI by repeating the steps above. + +--- + +## Troubleshooting & Tips 🧩 + +- ❌ Not connecting? Make sure the URL is correct and accessible from the browser used to run Open WebUI. +- πŸ”’ If you're using remote servers, check firewalls and HTTPS configs! +- πŸ“ To make servers persist, consider deploying them in Docker or with system services. + +Need help? Visit the πŸ‘‰ [Discussions page](https://github.com/open-webui/openapi-servers/discussions) or [open an issue](https://github.com/open-webui/openapi-servers/issues). diff --git a/static/images/openapi-servers/open-webui/info-modal.png b/static/images/openapi-servers/open-webui/info-modal.png new file mode 100644 index 0000000..601f249 Binary files /dev/null and b/static/images/openapi-servers/open-webui/info-modal.png differ diff --git a/static/images/openapi-servers/open-webui/message-input.png b/static/images/openapi-servers/open-webui/message-input.png new file mode 100644 index 0000000..6cad3a4 Binary files /dev/null and b/static/images/openapi-servers/open-webui/message-input.png differ diff --git a/static/images/openapi-servers/open-webui/settings.png b/static/images/openapi-servers/open-webui/settings.png new file mode 100644 index 0000000..692b6fe Binary files /dev/null and b/static/images/openapi-servers/open-webui/settings.png differ diff --git a/static/images/openapi-servers/open-webui/time-server.png b/static/images/openapi-servers/open-webui/time-server.png new file mode 100644 index 0000000..feae13e Binary files /dev/null and b/static/images/openapi-servers/open-webui/time-server.png differ