From 02e2d5cda5c56cabca0e6c51e4bd27f69760ca6c Mon Sep 17 00:00:00 2001 From: pycook Date: Mon, 18 Aug 2025 19:10:59 +0800 Subject: [PATCH] refactor(deploy): frontend dev env --- deploy/dev-start.sh | 16 ++- deploy/docker-compose.frontend-dev.yaml | 27 +++++ deploy/nginx.frontend-dev.conf | 129 ++++++++++++++++++++++++ 3 files changed, 169 insertions(+), 3 deletions(-) create mode 100644 deploy/nginx.frontend-dev.conf diff --git a/deploy/dev-start.sh b/deploy/dev-start.sh index f0b9276..7656335 100755 --- 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 diff --git a/deploy/docker-compose.frontend-dev.yaml b/deploy/docker-compose.frontend-dev.yaml index 385f82f..b1b3cff 100644 --- 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 diff --git a/deploy/nginx.frontend-dev.conf b/deploy/nginx.frontend-dev.conf new file mode 100644 index 0000000..62dc5b0 --- /dev/null +++ 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; +} \ No newline at end of file