From e531c8808d76fc93db92fdf6532e0179c85e67dd Mon Sep 17 00:00:00 2001 From: lintsinghua Date: Mon, 15 Dec 2025 16:13:47 +0800 Subject: [PATCH] refactor: standardize dialog component styling and layout for improved consistency and responsiveness. --- docker-compose.yml | 4 +- frontend/Dockerfile | 42 +++++--------- frontend/nginx.conf | 20 +++++++ frontend/src/pages/AuditRules.tsx | 70 +++++++++++++--------- frontend/src/pages/Projects.tsx | 18 +++--- frontend/src/pages/PromptManager.tsx | 87 +++++++++++++++++----------- 6 files changed, 143 insertions(+), 98 deletions(-) diff --git a/docker-compose.yml b/docker-compose.yml index 769add8..0c9558c 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -65,9 +65,7 @@ services: context: ./frontend restart: unless-stopped ports: - - "3000:3000" - environment: - - VITE_API_BASE_URL=http://localhost:8000/api/v1 + - "3000:80" # Nginx 监听 80 端口 depends_on: - backend networks: diff --git a/frontend/Dockerfile b/frontend/Dockerfile index 949cd38..22ba070 100644 --- a/frontend/Dockerfile +++ b/frontend/Dockerfile @@ -1,3 +1,8 @@ +# ============================================= +# DeepAudit Frontend Docker 构建 +# ============================================= +# 使用 Nginx 提供静态文件和反向代理 (支持 SSE 流式传输) + FROM node:20-alpine AS builder WORKDIR /app @@ -20,38 +25,23 @@ RUN unset http_proxy https_proxy HTTP_PROXY HTTPS_PROXY all_proxy ALL_PROXY && \ # 复制源代码 COPY . . -# 构建时使用占位符，运行时替换 -ENV VITE_API_BASE_URL=__API_BASE_URL__ +# 🔥 构建时使用相对路径 /api - Nginx 会处理代理 +ENV VITE_API_BASE_URL=/api/v1 # 构建生产版本 RUN pnpm build -# 生产镜像 -FROM node:20-alpine - -WORKDIR /app - -# 清除代理设置 -ENV http_proxy= -ENV https_proxy= -ENV HTTP_PROXY= -ENV HTTPS_PROXY= - -# 安装 serve（确保无代理） -RUN unset http_proxy https_proxy HTTP_PROXY HTTPS_PROXY all_proxy ALL_PROXY && \ - npm install -g serve +# ============================================= +# 生产镜像 - 使用 Nginx (支持 SSE 反向代理) +# ============================================= +FROM nginx:alpine # 复制构建产物 -COPY --from=builder /app/dist ./dist - -# 复制启动脚本 -COPY docker-entrypoint.sh /docker-entrypoint.sh -RUN chmod +x /docker-entrypoint.sh - -EXPOSE 3000 - -ENTRYPOINT ["/docker-entrypoint.sh"] -CMD ["serve", "-s", "dist", "-l", "3000"] +COPY --from=builder /app/dist /usr/share/nginx/html +# 复制 Nginx 配置 (包含 SSE 反向代理配置) +COPY nginx.conf /etc/nginx/conf.d/default.conf +EXPOSE 80 +CMD ["nginx", "-g", "daemon off;"] diff --git a/frontend/nginx.conf b/frontend/nginx.conf index cb2e6d9..9d8bfca 100644 --- a/frontend/nginx.conf +++ b/frontend/nginx.conf @@ -16,6 +16,26 @@ server { proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; + + # ========== SSE 流式传输必需配置 ========== + # 禁用代理缓冲，确保事件实时推送 + proxy_buffering off; + proxy_cache off; + + # 明确告知 Nginx 不要缓冲 (对上游 FastAPI 的 X-Accel-Buffering 头也有效) + proxy_set_header X-Accel-Buffering no; + + # 支持 chunked 编码 + chunked_transfer_encoding on; + + # SSE 长连接超时配置 + proxy_read_timeout 300s; # 5 分钟读取超时 (与后端 max_idle 一致) + proxy_connect_timeout 10s; + proxy_send_timeout 60s; + + # 保持连接 + proxy_http_version 1.1; + proxy_set_header Connection ''; } # 缓存静态资源 diff --git a/frontend/src/pages/AuditRules.tsx b/frontend/src/pages/AuditRules.tsx index e7cd921..c854611 100644 --- a/frontend/src/pages/AuditRules.tsx +++ b/frontend/src/pages/AuditRules.tsx @@ -11,7 +11,7 @@ import { Input } from '@/components/ui/input'; import { Textarea } from '@/components/ui/textarea'; import { Label } from '@/components/ui/label'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; -import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'; import { ScrollArea } from '@/components/ui/scroll-area'; import { toast } from 'sonner'; import { @@ -435,12 +435,16 @@ export default function AuditRules() { {/* Create Rule Set Dialog */} - - - - 新建规则集 + + + +
+ +
+ 新建规则集 + -
+
setRuleSetForm({ ...ruleSetForm, name: e.target.value })} placeholder="规则集名称" className="cyber-input" /> @@ -470,7 +474,7 @@ export default function AuditRules() {
- + @@ -479,12 +483,16 @@ export default function AuditRules() { {/* Edit Rule Set Dialog */} - - - - 编辑规则集 + + + +
+ +
+ 编辑规则集 + -
+
setRuleSetForm({ ...ruleSetForm, name: e.target.value })} className="cyber-input" /> @@ -510,7 +518,7 @@ export default function AuditRules() {
- + @@ -519,12 +527,16 @@ export default function AuditRules() { {/* Rule Edit Dialog */} - - - - {selectedRule ? '编辑规则' : '添加规则'} + + + +
+ +
+ {selectedRule ? '编辑规则' : '添加规则'} + -
+
@@ -568,7 +580,7 @@ export default function AuditRules() { setRuleForm({ ...ruleForm, reference_url: e.target.value })} placeholder="如 https://owasp.org/..." className="cyber-input" />
- + @@ -577,16 +589,22 @@ export default function AuditRules() { {/* Import Dialog */} - - - - 导入规则集 + + + +
+ +
+
+ 导入规则集 +

粘贴导出的 JSON 内容

+
+ - 粘贴导出的 JSON 内容 -
+