[大模型实战 02] 图形化的大模型交互: Open WebUI部署指南

荷花旋旋 發表於 2026-2-2 20:16:00

[大模型实战 02] 图形化的大模型交互: Open WebUI部署指南

<blockquote>
核心摘要 (TL;DR)
<ul>
<li>目标：为本地的 Ollama 模型穿上漂亮的图形化界面 (GUI)。</li>
<li>工具：Docker + Open WebUI (社区最活跃的开源 WebUI)。</li>
<li>核心功能：媲美 ChatGPT 的对话界面、本地知识库 (RAG)、自定义角色 (Agent)。</li>
</ul>
</blockquote>
相信各位友人在上一篇文章中，已经学会了如何用ollama在终端中运行Qwen模型。命令行工具有时候会感觉有点过于Geek，黑洞洞的命令窗口和冷冰冰的滚动的文字的技术感是有的，但是对于如果咱们想把大模型展示给其他朋友，或者自己想日常使用，那这时候咱们就需要换一个更友好，更光鲜的交互方式。
这也是这篇博文想带大家解决的问题：用10分钟时间，搭建一个功能媲美ChatGPT的私有化网页页面，并且连接咱们的模型
Open WebUI就是我们完成这个目标的利器，其也是目前社区最活跃，功能最强大的开源大模型交互界面。
<h2 id="01-模型服务准备">01. 模型服务准备</h2>
在开始之前，因为要接入咱们的Ollama模型，所以我们要确认我们的Ollama服务运行起来了。
可以通过在终端输入<code>curl http://localhost:5656</code>命令去验证其是否正确开启。（当然，这个端口号需要根据咱们自己的配置来，默认还是11434，经过上一篇博文，咱们为了避免服务器端口被扫导致咱们模型被滥用，已经将端口切换到5656了）。 
如果显示<code>Ollama is running</code>，就说明咱们准备ok了。 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/validate_Ollama_is_running.png" alt="终端运行curl命令的截图，显示"Ollama is running"的返回结果" loading="lazy">
<h2 id="02-使用docker一键安装-open-webui">02. 使用docker一键安装 Open WebUI</h2>
docker是个好东西，只需要几行命令，就能帮咱们部署各种服务。如果还没有了解过，那么强烈安利去学习一下基本命令。同样在这里，安装Open WebUI最简单，最省心的发自也是使用docker。如果是Windows用户，还没有安装Docker Desktop，可以先去Docker官网下载安装一下
我们这里使用下面这条命令，来自动下载OpenWebUI镜像并且启动该服务
<pre><code class="language-bash">docker run -d \
--network=host \
-v open-webui:/app/backend/data \
-e OLLAMA_BASE_URL=http://127.0.0.1:5656 \
-e PORT=3000 \
--name open-webui \
--restart always \
ghcr.io/open-webui/open-webui:main
</code></pre>
这里稍微解释一下，这行命令做了什么
<ul>
<li><code>-d</code>：后台静默运行。在后台悄悄跑着，不会因为关掉了终端就消失了。</li>
<li><code>--network=host</code>以及<code>-e OLLAMA_BASE_URL=http://host.docker.internal:5656</code>:关键参数**。这让 Docker 容器内部能通过这个特殊的地址访问我们宿主机上的 Ollama 服务。注意这里的端口需要是我们的Ollama服务端口</li>
<li><code>-v open-webui:/app/backend/data</code>：将容器的/app/backend/data目录映射到docker管理的的open-webui目录，这样就把聊天记录和设置保存到本地卷中，防止重启 Docker 后数据丢失。如果想要清除该卷,可以在关闭容器后，通过<code>docker volume rm open-webui</code>去删除</li>
</ul>
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/docker_run_openwebui.png" alt="终端执行 Docker 命令后的截图，显示一串容器 ID 意味着启动成功" loading="lazy">
输入下面的命令，可以查看Open WebUI的容器是否运行成功
<pre><code class="language-bash"> docker ps -a
</code></pre>
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/docker-ps-a-reslt.png" alt="运行完docker ps -a后的状态结果验证截图" loading="lazy">
和上图一样，各位友人如果看见状态（Status）是Up的，我们就可以进行下一步，去打开咱们的服务了。
打开任意浏览器，访问<code>http://localhost:3000</code>，就能看见设计精良的登录页面了 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/open-web-ui-landing-page.png" alt="安装好OpenWebUI服务后，打开登录页面的截图" loading="lazy">
附上官方链接和官方文档，以供有深入了解想法的友人去探索。 
Open WebUI的github链接 
Open WebUi的官方文档
<h2 id="03-连接大模型">03. 连接大模型</h2>
<h3 id="31-注册管理员账号">3.1 注册管理员账号</h3>
各位友人第一次打开页面，需要咱们注册一下账号。因为是本地部署的服务，所以，账号密码都只在咱们自己的电脑里，不会上传给其他人（当然，如果咱们部署在服务器上，别人也是可以访问，登录的）
<h3 id="32-选择模型">3.2 选择模型</h3>
登录上之后，整个界面还是非常清新的，布局和ChatGPT是很相像的。然后我们就需要选择我们刚才的Ollama模型
<ol>
<li>点击左上角的 选择模型下拉菜单</li>
<li>应该能看到咱们的<code>modelscope.cn/Qwen/Qwen3-0.6B-GGUF</code>模型，如果没有也没事，我们可以权且先跳过这一块儿，先看看后面的解决方案，解决了再回来。 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/model_list_in_openwebui.png" alt="界面左上角下拉菜单展开，鼠标指向 qwen 模型" loading="lazy"></li>
<li>选择好之后，我们进行下一步</li>
</ol>
如果在选择模型菜单中，没有看到我们的模型，就需要检查一下OpenWebUI的ollama配置
<ol>
<li>点击用户名->管理员面板，打开 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/admin_page.png" alt="点击用户名，弹出有管理员面板的菜单栏截图" loading="lazy"></li>
<li>点击面板上方的设置 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/open_settings.png" alt="点击管理员面板上方的设置截图" loading="lazy"></li>
<li>点击左侧外部链接 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/click_out_link.png" alt="点击左侧外部链接的示意图截图" loading="lazy"></li>
<li>点击管理Ollama接口连接的设置按钮 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/click_manage_ollama_setting.png" alt="点击管理Ollama接口连接的设置按钮的截图" loading="lazy"></li>
<li>核对当前的连接地址，端口是否正确，然后点击验证链接按钮进行验证 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/check_ollama_links.png" alt="然后点击验证链接按钮进行验证截图" loading="lazy"></li>
<li>验证通过，就能回到主页找到我们的模型了</li>
</ol>
<h3 id="33-对话功能">3.3 对话功能</h3>
在输入框中，我们就能像chatGPT一样跟模型进行对话了, markdown渲染，思考过程折叠，代码高亮，流式输出功能都是具备的。 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/first_chat_with_model.png" alt="与 Qwen 模型对话的截图，展示 Markdown 渲染效果" loading="lazy">
<h3 id="34-进阶使用">3.4 进阶使用</h3>
除了最简单的对话功能，Open WebUI还能做什么？我们重点介绍一下最实用，最具“生产力”的两个功能
<h3 id="功能一本地知识库rag">功能一：本地知识库（RAG）</h3>
RAG，全程是Retrieval Augmented Generation，检索增强生成。翻译成人大白话，检索，即我们给训练好了的模型一些文本，它将其作为上下文，去文本中检索问题相关的内容；增强，增强的意义在于，我们不用重新训练模型，没有任何模型会在该技术中被训练，通过改变交给模型的知识库，模型可以得到更贴合我们需要的内容，比如产品的使用说明，一本故事书，最新的项目文档;生成，意味着当前输出还是由模型生成而来，还是运用模型本身对世界的理解能力。总而言之，RAG可以让模型成为我们量身定做的私人管家，自己的私人本地知识库。
在Open WebUI中，我们不用写一行代码，就可以实现这样便利的技术。 
实操步骤
<ol>
<li>上传文档：在聊天输入框左侧，点击 [+] 号（加号图标），选择 上传文件。上传一份 PDF 文档（例如一份产品说明书或论文）。 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/upload_files.png" alt="在聊天框点击加号图标选择上传文件的截图" loading="lazy"></li>
<li>确认加载：文件上传后，显示在聊天框左上角 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/loaded_pdf.png" alt="文件上传后，显示在聊天框左上角截图" loading="lazy"></li>
<li>提问：针对文档问题，进行提问，例如：“介绍一下这本书” 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/chat_with_rag.png" alt="RAG提问介绍一下这本书后的模型反馈截图" loading="lazy"></li>
</ol>
OpenWebUI内置了一些轻量级的向量模型，来将我们的文档分块，转化为向量, 存入内置的向量数据库中。当咱们提问的时候，它会找到和我们问题向量（对，模型也会将我们的问题转为向量）相近的段落，然后将这些段落给模型当作上下文，模型再据此给我们答复。
<h3 id="功能二给模型特定人设system-prompts">功能二：给模型特定人设（System Prompts）</h3>
这个也比较好理解，我们和模型说的每句话，都是一句句prompt，但是prompt之间亦有差别，大致分为User Prompt和System Prompt，User Prompt就是我们跟模型说的每句话，System Prompt是提前告知模型的一些不能忘记的预设知识，比如告诉Qwen模型，它是阿里公司训练的，名叫Qwen的模型，还有类似模型身份认知的东西，默认一般都是类似于“你是一个能够帮助人们回答问题的助手”。
所以，这个模型的人设，也是可以改的，我们下面以哲学家苏格拉底为人设试试。
实操步骤
<ol>
<li>点击左侧侧边栏的 工作空间。 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/workspace.png" alt="左侧工作空间截图" loading="lazy"></li>
<li>在模型界面选择右上角的创建模型。当然我们这里并不是真的要创建一个模型，而是从现在的模型上派生出一个配置不一样的模型. 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/create_model.png" alt="右上角的创建模型位置截图" loading="lazy"></li>
<li>在模型名称处给模型一个我们喜欢的模型</li>
<li>在模型ID处填写一个id号</li>
<li>在基础模型处选择我们已有的模型（目前0.6B的模型如果不够聪明，可以去ollama拉去更聪明的模型）</li>
<li>在系统提示词处填入我们准备的人设 “你是一位古希腊哲学家苏格拉底。你从不直接回答问题，而是通过反问来引导用户思考。”,咱也可以自由发挥，再加一些补充。</li>
<li>保存并创建 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/created_model.png" alt="创建完模型后的截图" loading="lazy"></li>
<li>回到主页，我们就可以选择新的这个派生模型进行问答了 
<img src="https://cdn.jsdelivr.net/gh/Algieba-dean/BlogImgs@master/blog-images/test_blog/llm02-start-with-open-webui/chat_with_new_model.png" alt="创建好新的模型后的新聊天窗口截图" loading="lazy"></li>
</ol>
OpenWebUI实际上是还可以接入联网搜索能力的，但是取决于模型本身的工具调用能力（function call能力）是否足够强大，如果我们用了更聪明的模型，可以开启该功能
<h2 id="04-题外话">04. 题外话</h2>
OpenWebUI其实还有很多其他功能，比如真正的创建一个知识库，而不是简单的读文档，甚至可以直接通过语音进行对话，进行长期记忆，接入更多有趣的工具（mcp）等等，但是此处篇幅有限，各位友人可以自行探索。
<h2 id="05-常见问题-qa">05. 常见问题 (Q&A)</h2>
这里整理了一些在操作过程中可能会关心的问题:
Q: Open WebUI 只能连本地的 Ollama 吗？ 
A: 不是的。它是一个通用的前端界面，兼容性极强。
<ul>
<li>本地模型：Ollama, LocalAI 等。</li>
<li>在线 API：只要咱们有 OpenAI、Google Gemini、DeepSeek、Moonshot (Kimi) 等平台的 API Key，都可以在 设置 -> 外部连接 里填入，直接在一个界面里管理所有模型，不用到处切网页了。</li>
</ul>
Q: 我能在手机/平板上使用这个界面吗？ 
A: 完全可以！ 只要咱们的手机和运行 Open WebUI 的电脑在同一个 Wi-Fi (局域网) 下。
<ol>
<li>查询电脑的局域网 IP（Windows 在终端输 <code>ipconfig</code>，查看 IPv4 地址，比如 <code>192.168.1.5</code>）。</li>
<li>在手机浏览器输入 <code>http://192.168.1.5:3000</code>。</li>
<li>现在的 Open WebUI 完美适配移动端，体验和原生 App 差不多！</li>
</ol>
Q: Open WebUI 发布新版本了，我该怎么更新？ 
A: 因为咱们是用 Docker 部署的，更新非常简单，只需要重跑一遍镜像：
<ol>
<li>停止并删除旧容器：<code>docker rm -f open-webui</code> (放心，数据在 Volume 里，不会丢)。</li>
<li>拉取最新镜像：<code>docker pull ghcr.io/open-webui/open-webui:main</code>。</li>
<li>重新运行咱们文章里的那条 Docker 启动命令即可。</li>
</ol>
Q: 我上传的文档（RAG）安全吗？会被上传到云端吗？ 
A: 绝对安全。 
咱们搭建的是全私有化环境。Open WebUI 会调用本地的嵌入模型（Embedding Model）处理文档，所有数据都存储在咱们电脑本地的 Docker 卷中，不会经过任何外部服务器。
Q: 为什么我的文档上传后，模型回答还是很慢？ 
A: 这通常取决于两点：
<ol>
<li>文档解析：首次上传大文档时，系统需要时间将其切分并存入向量数据库。</li>
<li>模型性能：如果咱们的电脑配置较低（没有独立显卡），模型读取上下文的速度会变慢。建议在上传文档时，尽量上传纯文本或清晰的 PDF，避免全是图片的扫描件。</li>
</ol>
Q: 我在 Docker 命令里设置了端口，为什么访问不了？ 
A:
<ul>
<li>请检查 Windows 防火墙是否拦截了 3000 端口。</li>
<li>确保 Docker Desktop 是运行状态（Status: Up）。</li>
<li>如果是云服务器，记得在安全组里放行 3000 端口。</li>
</ul>
<hr>
本文作者： Algieba 
本文链接： https://blog.algieba12.cn/llm02-start-with-open-webui/ 
版权声明： 本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！ 
来源：https://www.cnblogs.com/algieba/p/19560594

頁: [1]

琼殿技术论坛's Archiver

[大模型实战 02] 图形化的大模型交互: Open WebUI部署指南