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/default-backend: {{ .Env.DEPLOYMENT }}-magnolia-error-page-svc (1)
    nginx.ingress.kubernetes.io/custom-http-errors: "503" (2)
1 The default backend, specified by environment, e.g., {{{ .Env.DEPLOYMENT }}-magnolia-error-page-svc.
We recommend that you use an environment variable here like so: {{ .Env.DEPLOYMENT }}-magnolia-error-page-svc. However, you can hardcode the environment name like so: integration-magnolia-error-page-svc. Environments refer to the backend environment such as Integration, UAT, or Production.
2 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
Feedback

PaaS

×

Location

This widget lets you know where you are on the docs site.

You are currently perusing through the Magnolia PaaS docs.

Main doc sections

DX Core Headless PaaS Legacy Cloud Incubator modules