traefik: Bind all missing frontends rules to custom error pages

Hey guys, are there updates on this?

I would also love to see that feature. I think a global configuration of custom error pages would be very useful (not just per frontend).

@guillaumebriday I agree, however, there are other cases that traefik might want to show a custom error page. 502 (Bad Gateway) your application is spinning up and not ready to receive traffic yet. 503 (Service unavailable) your application failed to load and will never take traffic. 504 (Gateway timeout) your application took too long to respond and traefik terminated the connection.

In all those cases, your application would not be able to respond with a custom error page.

However, I think it would be a great feature to allow traefik to not show the custom error page on pages that are actually served from the application. What I mean by this is, that if my application returns a 404 (with a custom page), Traefik will see the 404 and respond with it’s own custom 404 page. This means that my application UI is lost in favour of the traefik generic custom error page.

Just some thoughts…

Is the team interested in PRs related to this issue, or is it intended to be handled like the workarounds mentioned above?

I’m specifically interested in what the original issue seems to be about - a way of replacing the default 404 if a site is unavailable and 5xx if it failed to communicate with the backend server. I think @anlek is spot on here.

It sounds to me that replacing actual 404 etc. created by backend servers is another issue/feature altogether.

I forgot to say that my custom error pages are available here https://github.com/guillaumebriday/traefik-custom-error-pages

This is also seems to be an issue for existing domains that don’t have an upstream pod in k8s, using k8s ingress. Unless mistaken, I couldn’t find any example traefik configuration where a missing upstream service is seen as a 5xx error and than forwards the client to an external URL for the error page.

Ok I just finished to create the image, you can found the document here https://github.com/guillaumebriday/traefik-custom-error-pages

The image is already on docker https://hub.docker.com/r/guillaumebriday/traefik-custom-error-pages ready for production. For example : https://stale.guillaumebriday.xyz

Thank you guys

The only solution I found was this: https://www.techjunktrunk.com/docker/2017/11/03/traefik-default-server-catch-all/

A backend for every other domains that don’t exists. Not sure if it’s clean enough… But it does the job.

@Y0ngg4n https://github.com/tarampampam/error-pages provides a nice documentation how to bring custom errors to traefik. to replace the 404 error message which appears when hosts are not found, you just have to add a catchall with low priority and add the error middleware (only for 404 if you want). also described there …

One more docker image for this can be found here: github.com/tarampampam/error-pages.

Short features list:

• Can be used not only with traefik
• Themes (templates) support
• Large errors count
• Working configuration example

Hey @blacksheep-- I already created a docker image for this purpose : https://github.com/containous/traefik/issues/4218#issuecomment-474130067

It’s not perfect but it does the job

@coltenkrauter Here is an example (in docker-compose) of using custom pages both for failing to find an app via traefik (404 error) or any error raised in your app (this example it listen’s to errors between 500-511)

https://gist.github.com/anlek/522894d093431303e79e20992ef2114f

NOTE the important part for catching errors of any running container are these:

- "traefik.frontend.errors.network.backend=error"
- "traefik.frontend.errors.network.query=/{status}.html"
- "traefik.frontend.errors.network.status=500-511"

Let me know if you require any more details, Hope this helps!

Is there any update on this issue? How might I go about routing, for example, a HTTP 401 to a custom 401.html?

@guillaumebriday I very much like what you have done with traefik-custom-error-pages, but I am struggling to use it for anything more than the 404 error page.

I would prefer to use Traefik to somehow route all 401, 403, 404, 503 (common error pages) to corresponding custom HTML files, such as these traefik-custom-error-pages.

If anyone can point me in the right direction, I would appreciate it.

i’d like to add cache-control response headers to the default 404 error page, so that the page is not cached by my reverse proxy (e.g. cloudflare). But I can’t seem to find any docs about it for both traefik v1 and v2.

The default traefik 404 response headers are:

# traefik v1
$ curl --head 127.0.0.1:8080
HTTP/1.1 404 Not Found
Content-Type: text/plain; charset=utf-8
X-Content-Type-Options: nosniff
Date: Fri, 23 Jul 2021 13:49:38 GMT
Content-Length: 19

# traefik v2
$ curl --head 127.0.0.1:8081
HTTP/1.1 404 Not Found
Content-Type: text/plain; charset=utf-8
X-Content-Type-Options: nosniff
Date: Fri, 23 Jul 2021 13:49:41 GMT
Content-Length: 19

Can’t be that I would need an nginx sitting in front of traefik for this? 😕

The more I think about it, the more I wonder why Traefik should handle any other errors than 404 aka “when an endpoint does not exist” ?

My applications already have errors pages for 5xx ou 4xx. If my applications are already binded in Traefik the should be responsible for that.

What do you think ?

That’s nice !

I think I’m gonna create an nginx docker image with my errors pages inside directly to use your solution !

Thank you 👍