Skip to main content

Criando páginas de erro 404 personalizadas no ASP.NET MVC

É muito fácil de se criar páginas de erro personalizadas no MVC. Veja como fazer.

Posted in Dicas, ASP.NET, MVC

Todo mundo que trabalha fazendo sites sabe que ter páginas de erro é indispensável. Só que quando se trabalha com ASP.NET MVC é muito complicado se acertar na hora de configurar as páginas de erro. Sim, usar o web.config é o recomendado. Mas você tem certeza de que está funcionando?

Objetivo

O nosso objetivo aqui é aprender a fazer uma página personalizada de erro 404 e retornar o HTTP status code correspondente (404) sem alterar a url.

O que aprendemos sobre erros no começo

Normalmente, quando estamos iniciando no ASP.NET, aprendemos que temos que colocar a tag no web.config, configurar os parâmetros e esperar o erro aparecer. Veja o exemplo abaixo:

<customErrors mode="On">
	<error statusCode="404" path="erro404.html" />
customErrors>

Páginas 404 personalizadas

Normalmente quando uma página não existe o site retorna o erro 404, não importa se a página é estática (página html simples) ou dinâmica (página gerada pelo backend). No caso do exemplo acima o ASP.NET a gente está dizendo para o site para redirecionar para uma página amigável quando acontecer algum erro 404.

Até aí tudo bem.

O problema do MVC

No caso do MVC o buraco acaba sendo mais embaixo: Como o MVC é baseado em routes, controles e actions uma url como /lala/lele não vai passar pelo . O resultado vai ser aquele erro 404 padrão do ASP.NET.

A solução pra esse problema é simples, mas não é a mais correta. Basta colocar um redirect=”~/ erro404.html” no lugar do path, como no exemplo abaixo:

<customErrors mode="On">
	<error statusCode="404" redirect="~/erro404.html"/>
customErrors>

Agora, se você navegar pra uma url aleatória (lala/lele) você vai ser capaz de ver a sua página personalizada de erro. Só que, além da url se tornar /erro404.html?aspxerrorpath=/lala/lele você vai ver que o HTTP status code da página é 200.

E isso é muito longe do objetivo que traçamos no começo.

Não sou especialista em SEO mas deixa eu tentar explicar o problema: Se por um acaso a página que os indexadores acharem não existe, mas estamos retornando 200, eles vão achar que a página existe e vão indexar a página 404 personalizada como se ela fizesse parte da navegação do site.

A solução ideal

Como eu disse no começo, a ideia é retornar uma página de erro 404 personalizada junto com o HTTP status code correto, que é 404. E obviamente não podemos alterar a url. A maneira mais prática de se fazer isso é mexer direto no IIS. Claro que eu não vou tentar te convencer a ligar no seu host e pedir pra mudar alguma configuração. Para isso vamos usar o .

Simplificando: Enquanto o funciona no mesmo nível do ASP.NET, o funciona mais próximo ao IIS. O que significa que as alterações no vão afetar até mesmo arquivos estáticos. Logo, se quisermos fazer alguma alteração que seja mais próxima do servidor, é lá que devemos mexer.

Para fazer com que nossa página de erro 404 personalizada funcione no MVC devemos fazer como no exemplo a seguir:

<httpErrors errorMode="Custom">
	<remove statusCode="404"/>
	<error statusCode="404" path="/erro404.html" responseMode="File"/>
httpErrors>

Reparou que eu usei um antes? Isso evita erros caso já tenha algum statusCode=”404” definido. E, apesar de eu estar usando uma página html simples (o ideal), podemos usar uma rota específica para a página 404. Como por exemplo /erro/404. Só que nesse caso é recomendado usar o responseMode=”ExecuteUrl”.

Agora, se formos acessar uma url aleatória /lala/lele vamos ver que:

  1. A página 404 foi chamada
  2. O HTTP status code é 404
  3. A url não foi alterada

Pronto. Espero que isso tenha sanado suas dúvidas. De qualquer forma fique à vontade para comentar e perguntar.

Did you like the article?

You can subscribe and get them as soon they are online, share using the buttons bellow or leave a comment.

And you also can share using your favorite social network: