trailing slash guide

Guia de barra de arrasto

Tem problemas de barra após implantar um site estático em produção?

Este repo explica factualmente o comportamento de:

• Geradores de local estático
• Provedores de hospedagem

Também sugerimos algumas soluções possíveis

Introdução

Vamos nos familiarizar com os problemas de barra.

Problemas comuns :

• Problemas de SEO /perf: ao navegar /myPath , seu host redireciona para /myPath/
• 404 Questões: Link relativo, como <a href="otherPath"> são resolvidos de maneira diferente ( /otherPath ou /myPath/otherPath dependendo da presença /ausência de uma barra de arrasto
• Problemas de UX: Seu host adiciona uma barra à direita e, mais tarde

Causas :

• Os geradores estáticos do site podem emitir arquivos diferentes para o mesmo caminho /myPath : /myPath.html ou /myPath/index.html (o posterior pode levar a uma barra adicional)
• Todos os provedores host têm um comportamento diferente ao servir arquivos estáticos, não há padrão

Resumo

Considerando este site estático:

static
│
├── file.html
│
├── folder
│   └── index.html
│
├── both.html
└── both
    └── index.html

Comportamento de vários provedores de hospedagem estática:

Hospedar	Configurações	Url	/arquivo	/arquivo/	/File.html	/pasta	/pasta/	/Folder/index.html	/ambos	/ambos/	/both.html	/both/index.html
Páginas do Github		link	✅	? 404	✅	➡️ /pasta /	✅	✅	✅	✅	✅	✅
Netlify	Padrão: URLs bonitos em	link	✅	➡️ /arquivo	✅	➡️ /pasta /	✅	✅	✅	➡️ /Ambos	✅	✅
Netlify	Urls bonitos	link	✅	✅	✅	✅	✅	✅	✅	✅	✅	✅
Vercel	Padrão: CleanUrls = False TrailingsLash = indefinido	link	? 404	? 404	✅	✅	✅	✅	✅	✅	✅	✅
Vercel	CleanUrls = False TrailingsLash = Falso	link	? 404	? 404	✅	✅	➡️ /pasta	✅	✅	➡️ /Ambos	✅	✅
Vercel	CleanUrls = Falso TrailingsLash = True	link	? 404	? 404	✅	➡️ /pasta /	✅	✅	➡️ /ambos /	✅	✅	✅
Vercel	CleanUrls = True TrailingsLash = indefinido	link	✅	✅	➡️ /arquivo	✅	✅	➡️ /pasta	✅	✅	➡️ /Ambos	➡️ /Ambos
Vercel	CleanUrls = True TrailingsLash = false	link	✅	➡️ /arquivo	➡️ /arquivo	✅	➡️ /pasta	➡️ /pasta	✅	➡️ /Ambos	➡️ /Ambos	➡️ /Ambos
Vercel	CleanUrls = True TrailingsLash = True	link	➡️ /arquivo /	✅	➡️ /arquivo /	➡️ /pasta /	✅	➡️ /pasta /	➡️ /ambos /	✅	➡️ /ambos /	➡️ /ambos /
Páginas Cloudflare		link	✅	➡️ /arquivo	➡️ /arquivo	➡️ /pasta /	✅	➡️ /pasta /	✅	✅	➡️ /Ambos	➡️ /ambos /
Renderizar		link	✅	✅	✅	✅	✅	✅	✅	✅	✅	✅
Aplicativos da Web estática do Azure		link	✅	➡️ /arquivo	✅	✅	✅	✅	✅	✅	✅	✅

Procura-se ajuda

Vamos manter esse recurso atualizado e torná-lo exaustivo juntos.