🌐 MBE前端应用Cloudflare部署指南
✅ 当前可用域名
根据现有配置,您的域名是:hi-maker.com
现有域名配置
✅ mbe.hi-maker.com - MBE API后端服务
✅ dev.hi-maker.com - 开发环境
🎯 前端应用域名规划
建议的域名结构
教育平台应用:
📚 education.mbe.hi-maker.com → MBE Education (Port 3001)
或 edu.hi-maker.com
AIGC委员会:
🤖 aigc.mbe.hi-maker.com → AIGC Committee (Port 3002)
或 committee.hi-maker.com
民事律师:
⚖️ lawyer.mbe.hi-maker.com → Civil Lawyer (Port 3004)
或 law.hi-maker.com
管理后台:
🔧 admin.mbe.hi-maker.com → Admin UI (Port 3000)
🚀 快速部署方案
方案A: 使用Cloudflare Dashboard(最简单)
1. 进入Cloudflare Zero Trust Dashboard
访问: https://one.dash.cloudflare.com/
2. 配置Tunnel路由
进入 Networks → Tunnels → 找到您的Tunnel(可能是 hi-maker-tunnel)
3. 添加Public Hostname配置
| Subdomain | Domain | Service Type | URL |
|---|---|---|---|
| education.mbe | hi-maker.com | HTTP | mbe-education:3001 |
| aigc.mbe | hi-maker.com | HTTP | mbe-aigc-committee:3002 |
| lawyer.mbe | hi-maker.com | HTTP | mbe-civil-lawyer:3004 |
| admin.mbe | hi-maker.com | HTTP | mbe-admin-ui:3000 |
或使用简化域名:
| Subdomain | Domain | Service Type | URL |
|---|---|---|---|
| edu | hi-maker.com | HTTP | mbe-education:3001 |
| aigc | hi-maker.com | HTTP | mbe-aigc-committee:3002 |
| law | hi-maker.com | HTTP | mbe-civil-lawyer:3004 |
| admin | hi-maker.com | HTTP | mbe-admin-ui:3000 |
4. 保存并等待生效(1-2分钟)
方案B: 使用配置文件(高级)
1. 更新Cloudflare Tunnel配置
创建或更新 ~/.cloudflared/config.yml(Windows: C:\Users\<用户>\.cloudflared\config.yml):
# Cloudflare Tunnel 配置 - MBE完整系统
tunnel: hi-maker-tunnel
credentials-file: /root/.cloudflared/<tunnel-id>.json
ingress:
# ==================== 后端API ====================
- hostname: mbe.hi-maker.com
service: http://mbe-api:8000
originRequest:
connectTimeout: 30s
noTLSVerify: true
- hostname: dev.hi-maker.com
service: http://mbe-api-dev:8001
originRequest:
connectTimeout: 30s
# ==================== 前端应用 ====================
# MBE Education - 教育平台
- hostname: education.mbe.hi-maker.com
service: http://mbe-education:3001
originRequest:
connectTimeout: 30s
httpHostHeader: education.mbe.hi-maker.com
# AIGC Committee - AIGC委员会
- hostname: aigc.mbe.hi-maker.com
service: http://mbe-aigc-committee:3002
originRequest:
connectTimeout: 30s
httpHostHeader: aigc.mbe.hi-maker.com
# Civil Lawyer - 民事律师
- hostname: lawyer.mbe.hi-maker.com
service: http://mbe-civil-lawyer:3004
originRequest:
connectTimeout: 30s
httpHostHeader: lawyer.mbe.hi-maker.com
# Admin UI - 管理后台
- hostname: admin.mbe.hi-maker.com
service: http://mbe-admin-ui:3000
originRequest:
connectTimeout: 30s
httpHostHeader: admin.mbe.hi-maker.com
# ==================== WebSocket支持 ====================
- hostname: mbe.hi-maker.com
path: /ws/*
service: http://mbe-api:8000
originRequest:
connectTimeout: 120s
# ==================== 默认规则 ====================
- service: http_status:404
2. 配置DNS记录
使用Cloudflare命令行或Dashboard添加CNAME记录:
# 获取Tunnel ID
cloudflared tunnel list
# 添加DNS记录
cloudflared tunnel route dns hi-maker-tunnel education.mbe.hi-maker.com
cloudflared tunnel route dns hi-maker-tunnel aigc.mbe.hi-maker.com
cloudflared tunnel route dns hi-maker-tunnel lawyer.mbe.hi-maker.com
cloudflared tunnel route dns hi-maker-tunnel admin.mbe.hi-maker.com
或在Cloudflare Dashboard的DNS设置中手动添加:
类型: CNAME
名称: education.mbe
内容: <tunnel-id>.cfargotunnel.com
代理状态: 已代理(橙色云朵)
类型: CNAME
名称: aigc.mbe
内容: <tunnel-id>.cfargotunnel.com
代理状态: 已代理(橙色云朵)
类型: CNAME
名称: lawyer.mbe
内容: <tunnel-id>.cfargotunnel.com
代理状态: 已代理(橙色云朵)
类型: CNAME
名称: admin.mbe
内容: <tunnel-id>.cfargotunnel.com
代理状态: 已代理(橙色云朵)
🐳 Docker Compose完整配置
创建统一的生产部署配置
docker-compose.production.yml:
version: '3.8'
services:
# ==================== Cloudflare Tunnel ====================
cloudflared:
image: cloudflare/cloudflared:latest
container_name: mbe-cloudflare-tunnel
command: tunnel --no-autoupdate run --token ${CLOUDFLARE_TUNNEL_TOKEN}
restart: always
depends_on:
- mbe-api
- mbe-education
- mbe-aigc-committee
- mbe-civil-lawyer
- mbe-admin-ui
networks:
- mbe-network
# ==================== 后端服务 ====================
mbe-api:
image: mbe-api:latest
container_name: mbe-api
environment:
- DATABASE_URL=postgresql+asyncpg://mbe:${DB_PASSWORD}@postgres:5432/mbe
- REDIS_URL=redis://redis:6379
- LLM_API_KEY=${LLM_API_KEY}
- SECRET_KEY=${SECRET_KEY}
depends_on:
- postgres
- redis
volumes:
- ./src:/app/src
- ./knowledge_bases:/app/knowledge_bases
restart: unless-stopped
networks:
- mbe-network
postgres:
image: pgvector/pgvector:pg16
container_name: mbe-postgres
environment:
- POSTGRES_USER=mbe
- POSTGRES_PASSWORD=${DB_PASSWORD}
- POSTGRES_DB=mbe
volumes:
- pgdata:/var/lib/postgresql/data
restart: unless-stopped
networks:
- mbe-network
redis:
image: redis:alpine
container_name: mbe-redis
volumes:
- redisdata:/data
restart: unless-stopped
networks:
- mbe-network
# ==================== 前端应用 ====================
mbe-education:
image: mbe-education-frontend:latest
container_name: mbe-education
environment:
- NODE_ENV=production
- NEXT_PUBLIC_API_URL=https://mbe.hi-maker.com
- PORT=3001
restart: unless-stopped
networks:
- mbe-network
mbe-aigc-committee:
image: mbe-aigc-committee-frontend:latest
container_name: mbe-aigc-committee
environment:
- NODE_ENV=production
- NEXT_PUBLIC_API_URL=https://mbe.hi-maker.com
- PORT=3002
restart: unless-stopped
networks:
- mbe-network
mbe-civil-lawyer:
image: mbe-civil-lawyer-frontend:latest
container_name: mbe-civil-lawyer
environment:
- NODE_ENV=production
- NEXT_PUBLIC_API_URL=https://mbe.hi-maker.com
- PORT=3004
restart: unless-stopped
networks:
- mbe-network
mbe-admin-ui:
image: mbe-admin-ui:latest
container_name: mbe-admin-ui
environment:
- NEXT_PUBLIC_API_URL=https://mbe.hi-maker.com
restart: unless-stopped
networks:
- mbe-network
volumes:
pgdata:
redisdata:
networks:
mbe-network:
driver: bridge
环境变量配置
创建 .env.production:
# Cloudflare Tunnel
CLOUDFLARE_TUNNEL_TOKEN=eyJhIjoixxxxxx... # 从Dashboard获取
# 数据库
DB_PASSWORD=your-secure-password
# LLM配置
LLM_API_KEY=sk-your-deepseek-key
LLM_PROVIDER=deepseek
# 安全密钥
SECRET_KEY=your-secure-random-string-at-least-32-characters
🚀 部署步骤
1. 构建前端镜像
cd d:\Mises\mises-behavior-engine
# 构建所有前端应用
docker-compose -f opensource/docker-compose.frontend.yml build
2. 配置Cloudflare Tunnel
在 https://one.dash.cloudflare.com/ 中:
- 进入 Networks → Tunnels
- 选择现有Tunnel或创建新的
- 添加上面列出的Public Hostname配置
- 复制Tunnel Token到
.env.production
3. 启动完整系统
# 启动所有服务
docker-compose -f docker-compose.production.yml --env-file .env.production up -d
# 查看状态
docker-compose -f docker-compose.production.yml ps
# 查看日志
docker-compose -f docker-compose.production.yml logs -f
4. 验证部署
# 检查Tunnel状态
docker logs mbe-cloudflare-tunnel
# 测试访问
curl https://education.mbe.hi-maker.com
curl https://aigc.mbe.hi-maker.com
curl https://lawyer.mbe.hi-maker.com
curl https://admin.mbe.hi-maker.com
🌐 访问您的应用
部署成功后,可以通过以下域名访问:
🎓 教育平台
https://education.mbe.hi-maker.com
或
https://edu.hi-maker.com
🤖 AIGC委员会
https://aigc.mbe.hi-maker.com
或
https://committee.hi-maker.com
⚖️ 民事律师
https://lawyer.mbe.hi-maker.com
或
https://law.hi-maker.com
🔧 管理后台
https://admin.mbe.hi-maker.com
🔗 后端API
https://mbe.hi-maker.com
🔧 Next.js特殊配置
更新next.config.js
为了支持域名访问,确保每个前端应用的 next.config.js 包含:
/** @type {import('next').NextConfig} */
const nextConfig = {
output: 'standalone',
// 环境变量
env: {
NEXT_PUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8000',
},
// 允许的域名(用于图片等资源)
images: {
domains: ['mbe.hi-maker.com'],
},
// 重定向配置(可选)
async rewrites() {
return [
{
source: '/api/:path*',
destination: `${process.env.NEXT_PUBLIC_API_URL}/api/:path*`,
},
];
},
};
module.exports = nextConfig;
📊 监控与维护
健康检查脚本
创建 scripts/check_frontend_health.ps1:
# 检查所有前端应用健康状态
$apps = @(
@{Name="Education"; URL="https://education.mbe.hi-maker.com"},
@{Name="AIGC"; URL="https://aigc.mbe.hi-maker.com"},
@{Name="Lawyer"; URL="https://lawyer.mbe.hi-maker.com"},
@{Name="Admin"; URL="https://admin.mbe.hi-maker.com"}
)
Write-Host "检查MBE前端应用状态..." -ForegroundColor Cyan
Write-Host ""
foreach ($app in $apps) {
try {
$response = Invoke-WebRequest -Uri $app.URL -Method Head -TimeoutSec 10
if ($response.StatusCode -eq 200) {
Write-Host "✅ $($app.Name): 正常" -ForegroundColor Green
}
}
catch {
Write-Host "❌ $($app.Name): 异常" -ForegroundColor Red
}
}
# 检查Tunnel状态
Write-Host ""
Write-Host "检查Tunnel状态..." -ForegroundColor Cyan
docker ps --filter "name=cloudflare" --format "{{.Status}}"
自动化部署脚本
创建 scripts/deploy_frontend.ps1:
# MBE前端应用自动部署脚本
Write-Host "🚀 开始部署MBE前端应用..." -ForegroundColor Cyan
# 1. 拉取最新代码
Write-Host ""
Write-Host "1. 拉取最新代码..." -ForegroundColor Yellow
git pull origin main
# 2. 构建前端镜像
Write-Host ""
Write-Host "2. 构建前端镜像..." -ForegroundColor Yellow
docker-compose -f opensource/docker-compose.frontend.yml build --parallel
# 3. 停止旧容器
Write-Host ""
Write-Host "3. 停止旧容器..." -ForegroundColor Yellow
docker-compose -f docker-compose.production.yml stop mbe-education mbe-aigc-committee mbe-civil-lawyer
# 4. 启动新容器
Write-Host ""
Write-Host "4. 启动新容器..." -ForegroundColor Yellow
docker-compose -f docker-compose.production.yml up -d mbe-education mbe-aigc-committee mbe-civil-lawyer
# 5. 等待服务启动
Write-Host ""
Write-Host "5. 等待服务启动..." -ForegroundColor Yellow
Start-Sleep -Seconds 10
# 6. 健康检查
Write-Host ""
Write-Host "6. 健康检查..." -ForegroundColor Yellow
& .\scripts\check_frontend_health.ps1
Write-Host ""
Write-Host "✅ 部署完成!" -ForegroundColor Green
🔒 安全配置
Cloudflare安全设置
启用HTTPS强制重定向
- Cloudflare Dashboard → SSL/TLS → Edge Certificates
- 打开 "Always Use HTTPS"
配置防火墙规则
- Security → WAF → Create firewall rule
- 限制访问地区、频率等
启用Bot保护
- Security → Bots
- 选择合适的保护级别
配置访问策略(可选)
- Zero Trust → Access → Applications
- 为管理后台添加身份验证
🚨 故障排查
问题1: 502 Bad Gateway
# 检查容器状态
docker ps -a | Select-String "mbe-"
# 检查容器日志
docker logs mbe-education
docker logs mbe-cloudflare-tunnel
# 验证网络连接
docker exec mbe-cloudflare-tunnel ping mbe-education
问题2: DNS解析失败
- 检查DNS记录是否正确配置
- 清除本地DNS缓存:
ipconfig /flushdns - 等待DNS传播(最多48小时)
问题3: Tunnel连接失败
# 检查Token是否正确
docker logs mbe-cloudflare-tunnel | Select-String "token"
# 重启Tunnel
docker restart mbe-cloudflare-tunnel
📈 性能优化
1. Cloudflare缓存配置
在Cloudflare Dashboard → Caching → Configuration:
- 设置Browser Cache TTL
- 启用Auto Minify(JS, CSS, HTML)
- 启用Brotli压缩
2. Next.js优化
// next.config.js
module.exports = {
// 启用压缩
compress: true,
// 图片优化
images: {
formats: ['image/avif', 'image/webp'],
},
// SWC最小化
swcMinify: true,
};
📚 相关文档
✅ 部署检查清单
- Cloudflare账号已配置
- hi-maker.com域名已添加到Cloudflare
- Tunnel已创建并获取Token
- DNS记录已配置(4个子域名)
- 前端镜像已构建
-
.env.production已配置 - Docker容器已启动
- 所有应用可通过域名访问
- HTTPS正常工作
- API请求正常
- 监控脚本已设置
部署时间: 2026-02-01
域名: mbe.hi-maker.com
状态: ✅ 配置文档已就绪
🎉 您现在可以通过 *.mbe.hi-maker.com 访问所有MBE应用! 🌐✨