Custom error pages
This page covers setting one custom error page per container.
| If you would like to have a custom error page per site, you’ll need to use Virtual URI mapping. |
Modify the ingress configuration
To configure the default backend service, the ingress configuration needs to be altered in the webapp deployment’s values.yaml file.
values.yml
# Values for Magnolia Helm chart...
ingress:
enabled: true
annotations:
kubernetes.io/ingress.class: "nginx"
nginx.ingress.kubernetes.io/proxy-body-size: 512m
cert-manager.io/cluster-issuer: "letsencrypt-prod-dns"
nginx.ingress.kubernetes.io/configuration-snippet: | (1)
more_set_headers "X-Robots-Tag: noindex, nofollow";
nginx.ingress.kubernetes.io/default-backend: {{ .Env.DEPLOYMENT }}-magnolia-error-page-svc (2)
nginx.ingress.kubernetes.io/custom-http-errors: "503" (3)| 1 | Generally, you shouldn’t use configuration-snippet(s). Use the configuration-snippet exactly as instructed for this example. Otherwise, you may cause issues with your PaaS deployment. When in doubt, contact PaaS Support. | ||
| 2 | The default backend, specified by environment, e.g., {{{ .Env.DEPLOYMENT }}-magnolia-error-page-svc.
|
||
| 3 | By default every error code (>= 300 and < 600) is redirected to the default backend service.
It’s also possible to filter them out by whitelisting the error codes surrounded with ". |
Project structure
Start with cloning our template repository.
| This must be a completely separate project from your webapp. |
Console
git clone https://gitlab.magnolia-platform.com/developers-artifact/error-page-template.git <1>
rm -Rf .git <2>
mv error-page-template YOUR_REPOSITORY <3>| 1 | Clones the template from our repository. |
| 2 | Removes the .git settings so you can start fresh. |
| 3 | Moves the error-page-template to your repository. |
| The Kubernetes deployment files are provided by DX Cloud and just need to be present in the frontend application folder. |
Kubernetes deployment files
your_app_folder
├── .gitignore
├── .gitlab-ci.yml
├── README.md
└── src
└── index.html (1)| 1 | The index.html is the file where the custom error page HTML content must be dropped. It needs to include the
Javascript and CSS code. |
The .gitlab-ci.yml file
It’s important that you configure the .gitlab-ci.yml file correctly so that your frontend development changes are picked up and deployed.
| DX Cloud automatically picks up the changes when using this approach. |
.gitlab-ci.yml
stages:
- deploy
sync:
stage: deploy
image: registry.magnolia-platform.com/developers-artifact/error-page:v1.0.0
environment:
name: $NAME
before_script:
- export KUBECTL_NAMESPACE=$NAME
- export MAGNOLIA_RELEASE=$NAME
script:
- cp /k8s/base/* .
- envsubst < customization-template.yaml > customization.yaml ; kustomize build .
- kubectl -n $NAME apply -k .
rules:
- if: $CI_COMMIT_BRANCH == "develop"
variables:
NAME: integration
- if: $CI_COMMIT_BRANCH == "master"
variables:
NAME: prod