Texto e documentos
Números e cálculo
Dados e formatos
Segurança
Desenvolvimento e DevOps
Inteligência Artificial
Finanças
Saúde & Bem-estar
Produtividade
Jogos & Entretenimento
Multimédia e design
Empresa
Guia de utilização
O que é e para que serve

Gera o ficheiro de configuração do servidor web que uma SPA (Single Page App, aplicação de uma só página) precisa para funcionar bem: qualquer rota que o servidor não reconheça como ficheiro real é reescrita para o ficheiro de entrada (por predefinição index.html), e a partir daí o routing do lado do cliente (Angular, React, Vue…) assume o controlo. Escolhe o servidor, ajusta as opções e a saída atualiza-se em direto; depois copia-a e cola-a no teu servidor.

Por que uma SPA precisa desta reescrita

Numa SPA só existe um ficheiro HTML real (index.html); rotas como /tools/hamming ou /perfil/42 são inventadas pelo router em JavaScript, não são pastas nem ficheiros no disco.

• Se o utilizador navega dentro da app, tudo corre bem: o router desenha a vista sem recarregar.
• Mas se recarrega a página, entra por uma ligação direta ou partilha esse URL, o navegador pede-o tal e qual ao servidor. O servidor procura esse ficheiro, não o encontra e responde 404.

A solução é dizer ao servidor: «se a rota não for um ficheiro nem uma pasta reais, serve index.html». Assim o router arranca e resolve a rota no cliente. É exatamente isso que esta ferramenta gera.

Como se usa (passo a passo)

1. Escolhe o servidor onde vais implementar (Nginx ou Apache).
2. Escreve a Rota base onde vive a app (deixa-a em / se estiver na raiz do domínio).
3. Ajusta o Ficheiro de recurso se a tua entrada não for index.html.
4. Ativa os extras que quiseres: redirecionamento HTTPS, compressão e cache.
5. A configuração gera-se em baixo instantaneamente; clica em Copiar e cola-a no ficheiro correspondente do teu servidor.

Servidor: Nginx

Gera um bloco server

Servidor: Apache (.htaccess)

Gera um ficheiro .htaccess que colocas na pasta raiz da app (junto a index.html). Usa mod_rewrite: RewriteEngine On, um RewriteBase com a tua rota base e duas condições — !-f (não é ficheiro) e !-d (não é pasta) — que reescrevem qualquer outra rota para o recurso com RewriteRule ^ <recurso> [L]. Requer que o Apache tenha o mod_rewrite ativo e permita AllowOverride All nesse diretório.

Rota base e ficheiro fallback

• Rota base — a rota onde a app está implementada. É / se estiver na raiz do domínio, ou algo como /tools/es/ se estiver numa subpasta. É normalizada para terminar em / e é usada no location/try_files do Nginx e no RewriteBase do Apache.
• Ficheiro fallback — o ficheiro de entrada para o qual tudo é reescrito (por predefinição index.html). Muda-o só se o teu build gerar outro ponto de entrada.

Redirecionamento HTTPS

Adiciona o redirecionamento de HTTP para HTTPS (código 301) para que todo o tráfego use TLS. No Nginx separa a configuração em dois blocos: um na porta 80 que redireciona, e outro no 443 ssl http2 com marcadores ssl_certificate / ssl_certificate_key que deves apontar para os teus certificados. No Apache adiciona uma regra com RewriteCond %

Compressão e cache

Dois extras de desempenho opcionais:

• Compressão gzip/deflate — comprime HTML, CSS, JS e JSON antes de os enviar, para que descarreguem mais depressa (gzip on no Nginx; mod_deflate no Apache).
• Cache de assets estáticos (1 ano) — diz ao navegador para guardar imagens, fontes, CSS e JS durante 1 ano (expires 1y + Cache-Control public, immutable no Nginx; mod_expires no Apache). Ideal quando os teus ficheiros têm hash no nome; se não, uma versão nova pode demorar a aparecer.

Copiar e implementar

O cabeçalho da saída mostra o nome do ficheiro destino (nginx.conf ou .htaccess). Carrega no botão de copiar para levar toda a configuração para a área de transferência e cola-a nesse ficheiro do teu servidor. Lembra-te de recarregar o servidor depois de aplicar as alterações para que façam efeito.

Config Nginx/Apache SPAGera configuração para servir uma SPA
Config Nginx / Apache SPAGera a configuração para servir uma SPA (Single Page App)
Servidor:
Caminho onde a app está publicada
nginx.conf
server {
    listen 80;
    server_name example.com;
    root /var/www/html;

    # Redirect HTTP to HTTPS
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl;
    http2 on;   # nginx ≥ 1.25.1; en versiones anteriores: listen 443 ssl http2;
    server_name example.com;
    root /var/www/html;

    ssl_certificate     /path/to/cert.pem;
    ssl_certificate_key /path/to/key.pem;
    ssl_protocols TLSv1.2 TLSv1.3;

    # Security headers (no rompen una SPA; una CSP completa depende de tu app)
    server_tokens off;
    add_header X-Content-Type-Options "nosniff" always;
    add_header Referrer-Policy "strict-origin-when-cross-origin" always;
    add_header X-Frame-Options "DENY" always;
    add_header Content-Security-Policy "frame-ancestors 'none'; object-src 'none'; base-uri 'self'" always;
    add_header Strict-Transport-Security "max-age=31536000" always;   # añade includeSubDomains cuando TODOS los subdominios vayan por https

    # Nunca servir ficheros ocultos: .git/, .env, .htpasswd… (salvo .well-known)
    location ~ /\.(?!well-known) {
        deny all;
    }

    # Gzip compression
    gzip on;
    gzip_vary on;
    gzip_types text/plain text/css application/json application/javascript text/xml application/xml;

    # Cache static assets — «immutable» solo es correcto si el nombre lleva hash (main-3F2A1B.js)
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
        # Repetidas: un add_header aquí anula las del server
        add_header X-Content-Type-Options "nosniff" always;
        add_header Referrer-Policy "strict-origin-when-cross-origin" always;
        add_header X-Frame-Options "DENY" always;
        add_header Content-Security-Policy "frame-ancestors 'none'; object-src 'none'; base-uri 'self'" always;
        add_header Strict-Transport-Security "max-age=31536000" always;   # añade includeSubDomains cuando TODOS los subdominios vayan por https
    }

    location / {
        try_files $uri $uri/ /index.html;
    }
}