refactor(deploy): frontend dev env

2025-09-26 19:31:14 +08:00 · 2025-08-18 19:10:59 +08:00
parent 9c11168197
commit 02e2d5cda5
3 changed files with 169 additions and 3 deletions
--- a/deploy/dev-start.sh
+++ b/deploy/dev-start.sh
@@ -96,13 +96,23 @@ start_frontend_dev() {
    print_info "Next steps:"
    echo "1. cd ../oneterm-ui"
    echo "2. yarn install"
-    echo "3. npm run serve"
+    echo "3. npm run serve (will start on http://localhost:8000)"
+    echo "4. Access application via nginx proxy: http://localhost:8080"
    echo ""
    print_info "Service access URLs:"
-    echo "- OneTerm API: http://localhost:18888"
-    echo "- ACL API: http://localhost:15000"
+    echo "- Application (via Nginx proxy): http://localhost:8080"
+    echo "- Frontend Dev Server: http://localhost:8000"
+    echo "- OneTerm API (direct): http://localhost:18888"
+    echo "- ACL API (direct): http://localhost:15000"
    echo "- MySQL: localhost:13306 (root/123456)"
    echo "- Redis: localhost:16379"
+    echo ""
+    print_info "Development workflow:"
+    echo "- Frontend changes: Edit in oneterm-ui/, hot reload via http://localhost:8000"
+    echo "- Unified access: Use http://localhost:8080 (nginx proxy) for production-like experience"
+    echo "- OneTerm APIs: Proxied to host.docker.internal:18888 (local backend)"
+    echo "- ACL APIs: Proxied to acl-api:5000 (container backend)"
+    echo "- No CORS issues when accessing via nginx proxy"
 }

 # Start backend development environment
--- a/deploy/docker-compose.frontend-dev.yaml
+++ b/deploy/docker-compose.frontend-dev.yaml
@@ -147,6 +147,33 @@ services:
      - "2222:2222"  # SSH Port
      - "18888:8888" # API Port

+  # Nginx Proxy for Frontend Development (using UI image)
+  nginx-frontend-dev:
+    image: registry.cn-hangzhou.aliyuncs.com/veops/oneterm-ui:v25.8.2
+    container_name: oneterm-nginx-frontend-dev
+    environment:
+      TZ: Asia/Shanghai
+    volumes:
+      - ./nginx.frontend-dev.conf:/etc/nginx/conf.d/frontend-dev.conf
+      - ./volume/nginx-logs:/var/log/nginx
+    ports:
+      - "8080:8080"  # Nginx proxy port
+    depends_on:
+      - acl-api
+      - oneterm-api
+    restart: always
+    command:
+      - /bin/sh
+      - -c
+      - |
+        nginx -g 'daemon off;'
+    extra_hosts:
+      - "host.docker.internal:host-gateway"  # Allow container to access host
+    networks:
+      new:
+        aliases:
+          - nginx-frontend-dev
+
 networks:
  new:
    driver: bridge
--- a/deploy/nginx.frontend-dev.conf
+++ b/deploy/nginx.frontend-dev.conf
@@ -0,0 +1,129 @@
+server {
+    listen 8080;
+    server_name localhost;
+    
+    access_log /var/log/nginx/access.oneterm.frontend-dev.log;
+    error_log /var/log/nginx/error.oneterm.frontend-dev.log;
+
+    # CORS headers for development
+    add_header 'Access-Control-Allow-Origin' 'http://localhost:8000';
+    add_header 'Access-Control-Allow-Credentials' 'true';
+    add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS, PATCH';
+    add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With';
+
+    # Handle preflight requests
+    location ~* \.(OPTIONS)$ {
+        add_header 'Access-Control-Allow-Origin' 'http://localhost:8000';
+        add_header 'Access-Control-Allow-Credentials' 'true';
+        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS, PATCH';
+        add_header 'Access-Control-Allow-Headers' 'Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Requested-With';
+        add_header 'Content-Length' 0;
+        add_header 'Content-Type' 'text/plain charset=UTF-8';
+        return 204;
+    }
+
+    # Frontend development server proxy (Vue.js dev server)
+    location / {
+        proxy_pass http://host.docker.internal:8000;
+        proxy_set_header Host $host;
+        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;
+        
+        # WebSocket support for hot reload
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_read_timeout 86400;
+    }
+
+    # OneTerm API routes - WebSocket connections
+    location ^~ /api/oneterm/v1/connect {
+        proxy_pass http://host.docker.internal:18888;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Scheme $scheme;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_redirect off;
+        
+        # WebSocket support for terminal connections
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_read_timeout 7200s;
+        proxy_connect_timeout 7200s;
+        proxy_send_timeout 7200s;
+    }
+
+    # OneTerm API routes - File upload optimization
+    location ~ ^/api/oneterm/v1/(rdp/sessions/.+/files/upload|file/(session/.+/upload|upload/.+/.+)) {
+        proxy_pass http://host.docker.internal:18888;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Scheme $scheme;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_redirect off;
+        proxy_http_version 1.1;
+        
+        # File upload optimization
+        proxy_request_buffering off;
+        proxy_buffering off;
+        proxy_read_timeout 1800s;
+        proxy_send_timeout 1800s;
+        proxy_connect_timeout 60s;
+        
+        # Large file upload settings
+        client_max_body_size 10240m;
+        client_body_buffer_size 32m;
+        client_body_timeout 1800s;
+    }
+
+    # OneTerm API routes - General API
+    location ^~ /api/oneterm {
+        proxy_pass http://host.docker.internal:18888;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Scheme $scheme;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_redirect off;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+    }
+
+    # ACL API routes (catch-all for /api/*)
+    location /api {
+        proxy_pass http://acl-api:5000;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Scheme $scheme;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_redirect off;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+    }
+
+    # Gzip compression
+    gzip on;
+    gzip_comp_level 6;
+    gzip_buffers 16 8k;
+    gzip_http_version 1.1;
+    gzip_min_length 256;
+    gzip_types
+        text/plain
+        text/css
+        text/js
+        text/xml
+        text/javascript
+        application/javascript
+        application/x-javascript
+        application/json
+        application/xml
+        application/rss+xml
+        image/svg+xml;
+}