数字人开发02--前端服务配置

本文是基于大模型的实时数字人开发的第二篇，主要介绍数字人项目前端环境的配置。

0、环境

• 后端：python + FastAPI，部署在云端。
• 前端：Next.js + React + HeroUI，在我的机器上，macPro。

1、后端部署

1.1、项目配置

注意：服务端要安装Git，我就不多少了。

git clone https://github.com/freecoinx/awesome-digital-human-live2d.git
cd awesome-digital-human-live2d# 初始化一个 uv 项目
uv init
vi pyproject.toml

添加清华大学的Python镜像，加速依赖安装。在文件头加入以下内容：

[[tool.uv.index]]
url = "https://pypi.tuna.tsinghua.edu.cn/simple" 
default = true  

保存文件内容，添加依赖：

uv add $(cat requirements.txt)

等待依赖下载完成，再使用模板创建配置文件：

cd configs
cp config_template.yaml config.yaml

这个配置文件保持默认即可，如果需要修改后端服务的端口，进去修改即可。

1.2、安装ffmpeg

sudo apt update
sudo apt install ffmpeg

1.3、run

进入你项目的根目录，别乱跑哦。

uv run python main.py

2、部署前端

2.1、基础环境

下载安装node.js，地址：https://nodejs.org。
然后安装包：

npm install -g next# mac上会提示权限问题，执行是加上sudo
npm install -g heroui-cli
npm install -g pnpm

2.2、项目配置

git clone https://github.com/freecoinx/awesome-digital-human-live2d.git
cd awesome-digital-human-live2d/web# 安装依赖
pnpm install

接下来，编辑前端的配置文件：

copy .env_template .env
vim .env

把我标出来的两处改成你服务器的地址，其他保持默认。

2.3、run

pnpm run build# 稍等一下，build需要时间
pnpm run start

浏览器上看看，效果如下：

看到美女，前端就部署成功了。不过，目前美女只能重复你的输入，我们改一下配置，让她调用咱们部署的llm，点击设置：

现在就可以和她对话了。

好了，今天就到这里了。大家展示一下你的数字好朋友吧。