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 faz

Gera um ficheiro de configuração para servir uma SPA (Single Page App), de forma que qualquer rota desconhecida seja reescrita para o ficheiro de entrada e o routing do lado do cliente funcione. O resultado atualiza-se em direto conforme as opções.

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.

Opções

Rota base é a rota onde a app está implementada (p. ex. /tools/es/) e Ficheiro fallback o destino da reescrita (por predefinição index.html). Os interruptores adicionam redirecionamento HTTPS, compressão gzip/deflate e cache de assets estáticos (1 ano).

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

Carrega no botão content_copy para copiar a configuração gerada para a área de transferência e colá-la no teu servidor.

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;
    }
}