想象一下这样一个场景：你正在开发一个需要集成AI功能的Web应用，但手头的敏感数据不敢上传到云端，或者恰好碰上在线服务的高峰期，页面转圈转得人心烦。作为前端开发者，即便本地部署大模型不是你的核心工作，掌握这项技能也能带来不少实惠——不仅能帮你吃透大模型的运行逻辑，为以后打造本地AI工具或模型可视化界面打下基础，更能让你彻底摆脱对在线服务的依赖，实现那种“离线可用、隐私可控”的AI交互体验。

好了，话不多说，咱们直接上干货。这篇文章会手把手拆解整个流程：从用Ollama在本地把大模型跑起来，到用Docker启动Open-WebUI搭出像ChatGPT那样的可视化聊天界面，再到关闭防火墙并借助内网穿透（花生壳或ngrok），最终让你的手机——不管是本地还是异地——都能轻松访问本地的这个大模型。以上全部流程都是本人亲测可用的，感兴趣的话可以跟着操作试试。

一、前置认知：搞懂核心工具，不做“盲目操作”

在正式开始动手之前，咱们有必要先搞清楚几个核心工具到底是干什么的。这样做的好处是，你不仅能“知其然”，更能“知其所以然”，明白每一步操作背后的逻辑。如果你对工具的名词解释不太感冒，直接跳到实操部分也完全没问题。

1.1 为什么前端要学习Ollama本地跑大模型？

这个疑问估计不少前端同学都有过：“本地跑大模型，那不是后端或者算法工程师的活吗，跟我有什么关系？” 其实，关系还真不小，主要原因有三个：

• 积累AI前端开发经验：AI原生应用正在成为主流。前端开发者如果了解大模型的部署逻辑、接口调用方式，就能更顺手地开发可视化界面，实现前端与本地模型的深度交互（比如做一个自定义聊天界面，或者模型参数调节面板）。
• 隐私与效率双保障：日常测试AI功能，或者处理敏感数据（工作文档、个人隐私信息）的时候，本地部署最大的好处就是不把任何数据传上第三方服务器。既安全，又能避开外网卡顿，哪怕离线状态也能正常使用。
• 降低开发成本：不用依赖云服务器去部署大模型，利用自己电脑的本地算力就能实现AI交互。对于个人学习、小型项目测试来说，这无疑是性价比最高的选择，根本不用考虑云服务器的算力费用。

1.2 什么是Ollama？

Ollama就是一个轻量级、上手很快的本地大模型运行工具。它的核心目标就一件事儿：让本地跑大模型这件事简化到普通人也能上手。你可以把它想象成是一个“大模型管理助手”，帮你快速下载、启动各类开源大模型（比如Llama 3、Qwen、Gemini等）。最棒的是，你不需要手动安装Python、PyTorch这些让人头疼的依赖，一行命令，模型就启动并运行起来了，对新手极其友好。

简单说，Ollama解决的是“普通人不会配置环境，导致无法本地运行大模型”这个痛点，让你能专注于怎么用模型，而不是纠结于环境怎么搭。

1.3 什么是Docker？为什么用Docker运行Open-WebUI？

Docker是一个“容器化工具”。它能把你需要的应用和它所有的依赖（比如环境配置、软件版本）打包成一个独立的“容器”。这个容器有个神奇的特点：“一次打包，到处运行”——无论你的电脑是Windows、Mac还是Linux，只要装了Docker，就能直接启动这个容器，再也不用担心环境不兼容、依赖缺失这种问题了。

而Open-WebUI呢，是一个开源的大模型可视化聊天界面，用起来跟ChatGPT那个网页版很像。它支持连接本地或远程的大模型，界面简洁好用，还能调节模型参数、保存聊天记录。

用Docker运行Open-WebUI，最大的好处就是：你不用手动去配置Open-WebUI的运行环境（什么Node.js、后端依赖都不用自己管），Docker会自动帮你搞定所有依赖。启动命令非常简单，而且不会弄脏你本地电脑的环境，以后想卸载，直接删掉容器就行，非常省心。

启动成功后的页面截图如下：

1.4 什么是内网穿透？为什么需要它？

我们本地电脑上运行的大模型和Open-WebUI界面，默认只能在“本地局域网”里访问（比如你跟电脑连同一个WiFi，手机就可以访问）。它没法通过互联网（比如你在外面）访问，更不可能让不在同一个局域网的朋友访问。

这时候就需要内网穿孔登场了。它的作用就是“把本地内网的服务（比如Open-WebUI）映射到互联网上”，生成一个公开的网络地址。这样一来，外部设备（手机、异地的电脑）就能通过这个地址，访问到我们本地的服务了。

一句话概括：没有内网穿透，你只能坐在自己电脑前用那个可视化界面聊天；有了内网穿透，你可以把这个界面分享给朋友，他们用手机就能访问你本地的这个大模型，实现真正的“本地部署，全网可访问”。

二、完整操作流程：从本地部署到手机访问（亲测可通）

接下来的流程分为4个核心步骤，每一步都有详细交代和截图展示。大家操作的时候可以一边看一边做，确保每一步都能复现。

步骤1：安装Ollama，本地运行大模型

这一步的核心就是“让大模型在本地电脑上跑起来”。Ollama的安装和使用非常简单，全程不需要复杂配置。

1. 下载Ollama：访问Ollama官方网站，根据自己的电脑系统（Windows/Mac/Linux）下载对应的安装包。双击安装，一路“下一步”就行，不需要额外设置。

安装成功后，在终端输入以下命令，看到版本号就说明安装成功了。

ollama -v

2. 去Ollama官网找模型。新手建议先挑一个小模型用来测试，大参数模型本地一般跑不起来，毕竟显存有限。

我选的是 qwen3.5:0.8b 这个模型。输入下面的命令行，它会开始下载模型，然后自动运行起来。下载完成后，你就可以直接在终端里跟它对话提问了。

ollama run qwen3.5:0.8b

这几个指令基本够用了，大家可以记一下：

ollama list          # 显示当前安装的模型
ollama run [name]    # 运行你下载的模型
ollama run [name] --think=false # 不需要思考（深层次推理）
ctrl + d             # 关闭Ollama
/bye                 # 关闭Ollama

特别注意：如果电脑显存不够，就老老实实下载小参数模型。开源模型通常都有很多个版本，注意选择适合自己的，避免运行起来卡成幻灯片。

步骤2：用Docker启动Open-WebUI，搭建可视化聊天界面

Ollama自带的终端聊天界面毕竟不够直观，所以我们要用Open-WebUI搭一个可视化的界面，操作起来更友好，还能保存聊天记录、调节模型参数。

1. 安装Docker：访问Docker官方网站，下载对应系统的Docker Desktop，安装完成后启动它。启动成功后，电脑状态栏会有Docker的图标，显示“Running”就是正常的。

在终端输入以下命令，看到版本号就说明安装成功（如果提示要升级WSL，按命令提示升级即可）。

docker -v

2. 启动Open-WebUI容器：打开终端，输入下面的Docker启动命令。

Open-WebUI的开源组件库地址在上面提到过，大家可以去看看官方启动方式。我这里做了一些修改，复制下面的命令直接运行就行：

docker run -d -p 0.0.0.0:3000:8080 --add-host=host.docker.internal:host-gateway -v open-webui:/app/backend/data --name open-webui --restart always -e DISABLE_AUTO_UPDATE=true ghcr.io/open-webui/open-webui:main

3. 访问Open-WebUI：命令执行完成后，等待1-2分钟，它可能会自动打开页面。如果没自动打开，就打开浏览器，输入 https://localhost:3000，就能进入Open-WebUI的登录界面了。首次登录可以创建一个管理员账号，不需要复杂配置。

4. 你还可以在设置页面，给你的模型设置一个系统级的Prompt（系统提示词），让模型在回答时按照你预设的风格来。

5. 一切就绪后，就可以开始问答了。如果你下载了多个模型，还可以在界面上随时切换。

需要注意：如果启动容器失败，请检查Docker是否正常运行，或者有没有端口冲突（3000端口被其他软件占用了）。如果冲突，可以把命令里的“3000:8080”改成“3001:8080”之类的其他端口。

步骤3：关闭防火墙，确保内网访问正常

防火墙会拦截外部设备对本地服务的访问。就算你跟电脑连着同一个WiFi，手机也可能没法正常打开Open-WebUI界面。所以需要临时关闭防火墙（等操作完了，可以根据需要再重新开启）。

1. Windows系统：打开“控制面板” → “系统和安全” → “Windows Defender防火墙”，点击“关闭Windows Defender防火墙”（注意要同时关闭公用网络和专用网络的防火墙）。
2. Mac系统：打开“系统设置” → “网络” → “防火墙”，点击“关闭”就行。

测试一下：关闭防火墙后，用同一WiFi下的手机，打开浏览器，输入“电脑本地IP:3000”（电脑本地IP可以用 ipconfig（Windows）或 ifconfig（Mac）查到）。如果能看到Open-WebUI的界面，说明内网访问已经打通了。

步骤4：内网穿透（花生壳/ngrok），实现手机端全网访问

关闭防火墙后，只能在同一局域网内访问。要让朋友（在异地）也能用手机访问，就得借助花生壳或ngrok这样的工具来做内网穿透，生成一个公开的访问地址。下面分别介绍两种工具的操作方法，大家二选一即可。

方法1：花生壳（更适合长期使用，稳定性强）

1. 下载安装花生壳：访问花生壳官方网站，下载对应系统的客户端，安装完成后注册并登录账号。

2. 添加内网穿透映射：登录后，点击“添加映射”，设置映射信息：

   1. 映射名称：随便写一个，比如“本地大模型界面”。
   2. 应用类型：选择“HTTP”。
   3. 内网主机：填写你的电脑本地IP（比如192.168.1.100）。
   4. 内网端口：填写3000（即Open-WebUI的端口）。
   5. 点击“确定”，花生壳会自动生成一个公开的访问地址（格式类似 xxxxxx.vipgz1.91vps.com）。

3. 测试访问：复制花生壳生成的公开地址，用手机（断开WiFi，用流量）打开浏览器，输入这个地址。如果能正常进入Open-WebUI界面，说明异地访问成功了。把这个地址分享给朋友，他们也能通过手机访问你本地的大模型。

方法2：国外的软件 ngrok（适合临时使用，操作简单，但在微信里打不开，会被屏蔽，浏览器可以正常打开）

1. 下载安装ngrok：访问ngrok官方网站，注册账号后，下载对应系统的版本。
2. 获取ngrok授权令牌：登录ngrok账号，在“Dashboard”页面找到“Auth Token”，复制下来。
3. 启动ngrok穿透：打开终端，进入ngrok解压目录，先输入 ngrok authtoken 你的授权令牌 完成授权。然后输入 ngrok http 3000，将本地3000端口映射到互联网。
4. 获取公开地址：命令执行后，终端会显示一个公开的访问地址（比如 xxxxxx.ngrok.io），复制这个地址。
5. 测试访问：用手机（流量）打开浏览器，输入这个地址。能正常看到Open-WebUI界面，就算穿透成功。把这个地址分享给朋友，他们就能手机访问了。

注意：ngrok免费版的公开地址每次重启都会变。如果需要固定地址，可以升级到付费版。

从实际体验来看，国内用户更推荐用花生壳来操作。

穿透成功后，手机访问效果如下：

三、常见问题排查（避坑指南）

操作过程中难免会遇到一些磕磕绊绊，这里整理了最常见的3个问题及解决方案，帮你快速避坑。

• 问题1：Open-WebUI无法连接Ollama模型？
  解决方案：检查Ollama是否正常运行（终端输入 ollama ps 查看模型状态）；检查Open-WebUI的模型连接地址是否正确（默认是 https://host.docker.internal:11434）；重启Docker容器和Ollama试试。

• 问题2：手机无法访问花生壳/ngrok生成的公开地址？
  解决方案：检查防火墙是否关闭；检查花生壳/ngrok的映射端口是否真的是3000；检查电脑本地IP是否填对；最后，重启一下内网穿透工具。

• 问题3：Ollama运行模型卡顿、闪退？
  解决方案：选择轻量化模型；关闭电脑上其他吃算力的软件（比如游戏、视频剪辑工具）；确保你的电脑内存至少8GB，显存至少4GB。

四、总结

回头看看整个流程，看起来步骤不少，但每一步都有很明确的目的。Ollama负责让大模型在本地跑起来，Docker负责把可视化界面的部署变得简单到极致，内网穿透则负责打破局域网的限制。这三者结合在一起，最终实现了“本地部署，全网可访问”的本地大模型可视化交互体验。

对于前端开发者来说，这套流程的意义远不止是“学会了一个小技能”。它不仅能让我们在日常工作中摆脱对在线大模型的依赖，更能让我们深入理解AI服务的完整部署逻辑。毕竟，未来的前端开发一定会和AI深度结合——提前把这些技能攥在手里，才能在下一波技术浪潮中更有底气。