项目介绍如前已述,
原项目的地址::
基础环境的配置
首先需要安装docker的windows端,下载地址:
下载完成之后,进行安装包的安装,所有都保持默认的选项,随着docker的安装随后会进入重启的阶段,如图所示:
安装docker随后,再安装git,git是一个分布式版本控制系统,常用于克隆github中的项目,其安装地址如下:
随后再powershell中执行以下命令以git原项目:
git clone https://github.com/jihe520/MathModelAgent.git
cd MathModelAgent
可以看到其目录结构如下:
MathModelAgent/
├── .cursor/
├── backend/ # 后端服务代码,包含 Dockerfile
│ ├── app/
│ ├── project/work_dir/
│ ├── .dockerignore
│ ├── .env.dev.example
│ ├── .gitignore
│ ├── Dockerfile # 后端 Docker 构建文件
│ ├── pyproject.toml
│ └── uv.lock
├── docs/
├── frontend/ # 前端服务代码,包含 Dockerfile
│ ├── public/
│ ├── src/
│ ├── .dockerignore
│ ├── .env.example
│ ├── .gitignore
│ ├── Dockerfile # 前端 Docker 构建文件
│ ├── README.md
│ ├── biome.json
│ ├── components.json
│ ├── index.html
│ ├── package.json
│ ├── pnpm-lock.yaml
│ ├── tailwind.config.js
│ ├── tsconfig.app.json
│ ├── tsconfig.json
│ └── tsconfig.node.json
├── .dockerignore
├── .gitignore
├── README.md
├── README_EN.md
└── docker-compose.yml # Docker Compose 配置文件,用于定义和运行多容器 Docker 应用
其中,docker-compose.yml
文件是本次部署的核心,它定义了 redis
、backend
和 frontend
三个服务及其相互依赖关系。backend/Dockerfile
和 frontend/Dockerfile
分别定义了后端和前端服务的 Docker 镜像构建过程。
后端配置
在 backend
目录下,有一个名为 .env.dev.example
的文件。这个文件包含了后端服务在开发环境下所需的环境变量示例。我们需要将其复制并重命名为 .env.dev
:
cd backend
copy .env.dev.example .env.dev
cd ..
然后我们需要修改.env.dev文件:
注意:因为使用的是docker部署,因此redis设置需要修改为以下内容:
REDIS_URL=redis://redis:6379/0
主要填写APIkey和url,随后我们打开网址,注册一个账号,并在文件里填写注册的邮箱。
随后我们使用docker compose命令启动docker:
docker compose up -d backend redis
待进度条全部走完之后,我们输入
docker compose ps
以检查docker的运行情况。
此外我们可以访问8000端口来检查redis后端配置的成功性:
在浏览器中输入如下地址进行访问:
http://localhost:8000/
出现如上提示则表明后端部署成功。
前端的配置
前端服务主要由 Vue 3 编写。我们将使用 docker-compose
来构建和启动前端服务。
在 frontend
目录下,有一个名为 .env.example
的文件。这个文件包含了前端服务所需的环境变量示例。我们需要将其复制并重命名为 .env.development
:
cd frontend
copy .env.example .env.development
cd ..
然后修改前端配置的文件:
需要确保在前端的文件中,后端的地址被正确地填写为8000端口。
随后再mathmodelagent的主目录下启动对前端的docker compose搭建:
docker compose up -d frontend
同样在进度条全部跑完之后,我们便可在命令行下输入
docker ps -a
以检查前端部署的正确性,
同样在浏览器中输入
http://localhost:5173/
如果网页正常打开,如图:,则证明前端部署成功。