🌐 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路由

进入 NetworksTunnels → 找到您的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/ 中:

  1. 进入 NetworksTunnels
  2. 选择现有Tunnel或创建新的
  3. 添加上面列出的Public Hostname配置
  4. 复制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安全设置

  1. 启用HTTPS强制重定向

    • Cloudflare Dashboard → SSL/TLS → Edge Certificates
    • 打开 "Always Use HTTPS"
  2. 配置防火墙规则

    • Security → WAF → Create firewall rule
    • 限制访问地区、频率等
  3. 启用Bot保护

    • Security → Bots
    • 选择合适的保护级别
  4. 配置访问策略(可选)

    • 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解析失败

  1. 检查DNS记录是否正确配置
  2. 清除本地DNS缓存: ipconfig /flushdns
  3. 等待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应用! 🌐✨