WebUI 部署 Ollama 可视化对话界面

一、Node.js 安装

1.系统环境查询

ubuntu20.04 系统，x86-64架构

$cat /etc/os-release
NAME="Ubuntu"
VERSION="20.04.6 LTS (Focal Fossa)"
ID=ubuntu
ID_LIKE=debian
PRETTY_NAME="Ubuntu 20.04.6 LTS"
VERSION_ID="20.04"
HOME_URL="https://www.ubuntu.com/"
SUPPORT_URL="https://help.ubuntu.com/"
BUG_REPORT_URL="https://bugs.launchpad.net/ubuntu/"
PRIVACY_POLICY_URL="https://www.ubuntu.com/legal/terms-and-policies/privacy-policy"
VERSION_CODENAME=focal
UBUNTU_CODENAME=focal

$ uname -m
x86_64

2.官网下载nodejs 安装包

官网链接为： https://www.nodejs.com.cn/download.html

下载链接为：https://cdn.npmmirror.com/binaries/node/v18.19.0/node-v18.19.0-linux-x64.tar.xz

3.安装 Node.js 并配置环境变量

下载的文件格式是tar.xz，需要用到两次命令进行解压

1、xz -d node-v18.19.0-linux-x64.tar.xz

2、tar -xvf node-v18.19.0-linux-x64.tar

解压完之后就是一个文件夹，里边存放着nodejs程序。

同时需要修改环境变量，打开/etc/profile在末尾追加如下：

# 其中/opt/node-v18.19.0-linux-x64 为node-v18.19.0-linux-x64.tar.xz  解压后所在的文件路径
export NODE_HOME=/opt/node-v18.19.0-linux-x64
export PATH=$NODE_HOME/bin:$PATH

修改环境变量后要source 使得环境变量生效，命令如下：

source /etc/profile

4.验证安装是否正确

验证方式如下：

$ node -v
v18.19.0

二、ollama-webui 安装与配置

1.代码库下载

克隆 ollama-webui 仓库，切换 ollama-webui 代码的目录。

git clone https://github.com/ollama-webui/ollama-webui-lite.git
cd ollama-webui-lite

2.依赖安装

命令如下：

npm ci

出现报错时，说明网络状态不佳，重试一次即可。

$ npm ci
npm notice 
npm notice New major version of npm available! 10.2.3 -> 11.1.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v11.1.0
npm notice Run npm install -g npm@11.1.0 to update!
npm notice 
npm ERR! code E404
npm ERR! 404 Not Found - GET http://mirrors.cloud.tencent.com/npm/sirv/-/sirv-2.0.4.tgz
npm ERR! 404 
npm ERR! 404  'sirv@http://mirrors.cloud.tencent.com/npm/sirv/-/sirv-2.0.4.tgz' is not in this registry.
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.npm ERR! A complete log of this run can be found in: /home/allyoung/.npm/_logs/2025-02-18T07_52_20_402Z-debug-0.log

正常运行日志如下

$ npm ciadded 212 packages, and audited 213 packages in 9s42 packages are looking for fundingrun `npm fund` for details15 vulnerabilities (5 low, 7 moderate, 3 high)To address issues that do not require attention, run:npm audit fixTo address all issues (including breaking changes), run:npm audit fix --forceRun `npm audit` for details.

3.运行

运行ollama-webui命令如下：

需要在第一步中下载的代码目录”ollama-webui-lite“ 中运行

npm run dev

打开网页http://<your_ip>:3000,然后进行Ollama Server URL配置，配置效果如下

三、遇到问题与解决

ollama-webui 启动后无法访问网页http://<your_ip>:3000。ollama 后台日志看到http 状态码为403。

解决方法：

1.在~/.bashrc文件中 ，添加内容

export OLLAMA_ORIGINS=*

2.然后source

source ~/.bashrc

3.更改后重新启动nodejs的服务。

解决后日志如下

参考链接：https://github.com/n4ze3m/page-assist/issues/309