# Deploy rápido do Front-end no mesmo VPS (API já em produção) ## 0) Detecção automática de stack do front (sem Node instalado no host) No VPS, rode no diretório do front: ```bash cd ~/apps/line-gestao-frontend python3 - <<'PY' import json p=json.load(open('package.json')) s=p.get('scripts',{}) if 'ng' in s or 'ng serve' in s.get('start',''): print('Stack detectada: Angular CLI') elif 'vite' in s.get('dev',''): print('Stack detectada: Vite') elif 'next' in s.get('dev','') or 'next' in s.get('start',''): print('Stack detectada: Next.js') else: print('Stack não identificada automaticamente') PY ``` Para este projeto, a stack detectada é **Angular**. --- ## Bloco A — preparação + build (usando Docker, sem npm/node no host) > Copiar/colar no VPS ```bash set -e # 1) atualizar código git -C ~/apps/line-gestao-frontend fetch --all git -C ~/apps/line-gestao-frontend checkout main git -C ~/apps/line-gestao-frontend pull --ff-only cd ~/apps/line-gestao-frontend # 2) garantir URL da API em produção no ambiente Angular cat > src/environments/environment.production.ts <<'EOT' export const environment = { production: true, apiUrl: '' }; EOT # 3) build de produção via container Node docker compose -f docker-compose.frontend.yml run --rm frontend-builder # 4) validar saída estática ls -lah dist/line-gestao-frontend/browser ``` --- ## Bloco B — publicação (Nginx container do front + Caddy da API) ```bash set -e cd ~/apps/line-gestao-frontend # 1) subir/atualizar Nginx estático do front docker compose -f docker-compose.frontend.yml up -d frontend-nginx # 2) backup e ajuste do Caddyfile da API para mesmo domínio sudo cp ~/apps/line-gestao-api/Caddyfile ~/apps/line-gestao-api/Caddyfile.bkp.$(date +%F-%H%M%S) sudo tee ~/apps/line-gestao-api/Caddyfile >/dev/null <<'EOT' linegestao.inglinesystems.com.br { encode zstd gzip @api path /api/* /auth/* /health reverse_proxy @api api:8080 reverse_proxy 127.0.0.1:8081 } EOT # 3) recarregar apenas o caddy cd ~/apps/line-gestao-api docker compose -f docker-compose.domain.yml up -d caddy ``` --- ## Bloco C — validação (curl + navegador) ```bash set -e # 1) front responde HTML curl -I https://linegestao.inglinesystems.com.br # 2) health da API continua OK curl -sS https://linegestao.inglinesystems.com.br/health # 3) endpoint de auth (esperado: 401/405/200 conforme regra da API) curl -i https://linegestao.inglinesystems.com.br/auth/login || true # 4) logs rápidos docker logs --tail 50 line-gestao-frontend-nginx docker compose -f ~/apps/line-gestao-api/docker-compose.domain.yml logs --tail 50 caddy ``` No navegador: 1. Abrir `https://linegestao.inglinesystems.com.br`. 2. Abrir DevTools (F12) > Network. 3. Confirmar que as chamadas de API estão no mesmo domínio e com respostas esperadas. --- ## Bloco D — troubleshooting rápido de CORS ```bash # 1) validar preflight curl -i -X OPTIONS 'https://linegestao.inglinesystems.com.br/auth/login' \ -H 'Origin: https://linegestao.inglinesystems.com.br' \ -H 'Access-Control-Request-Method: POST' # 2) confirmar FRONTEND_PUBLIC_URL na API grep FRONTEND_PUBLIC_URL ~/apps/line-gestao-api/.env # deve ser: # FRONTEND_PUBLIC_URL=https://linegestao.inglinesystems.com.br # 3) reaplicar API/Caddy após ajuste de .env cd ~/apps/line-gestao-api docker compose -f docker-compose.domain.yml up -d --force-recreate api caddy ``` Se continuar CORS, normalmente é: - front abrindo em URL diferente da permitida; - requisição indo para outro host/porta; - rota faltando no matcher `@api` do Caddy. --- ## Checklist final (homologação) - [ ] Front abre em `https://linegestao.inglinesystems.com.br`. - [ ] Login funciona com usuário válido. - [ ] Executa 1 fluxo principal (ex.: dashboard/listagem). - [ ] Sem erro de CORS no console. - [ ] Sem 401 inesperado após login (401 só antes de autenticar).