How to Serve a Static HTML Page using Nginx in a Kubernetes Cluster

Hemanth M Gowda
3 min readMay 27, 2021

--

Nginx is a powerful reverse proxy routing your domains from the Internet to your applications. This tutorial shows you how to serve a static HTML page with Nginx.

I’d like to share with you how I got my maintenance page set up for the application using Nginx.

Create a Dockerfile with proper static file and SSL configuration

Use the below static HTML file

<!doctype html>
<html>
<head>
<title>Maintainance Page</title>
<meta charset="utf-8"/>
<meta name="robots" content="noindex"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body { text-align: center; padding: 150px; background: black;}
h1 { font-size: 50px; color:white; }
body { font: 20px Helvetica, sans-serif; color: white; }
article { display: block; text-align: left; width: 650px; margin: 0 auto; }
a { color: #dc8100; text-decoration: none; }
a:hover { color: #333; text-decoration: none; }
</style>
</head>
<body>
<article>
<h1>We&rsquo;ll be back very soon!</h1>
<div>
<p>Sorry for the inconvenience but we&rsquo;re performing some maintenance at the moment. We&rsquo;ll be back online very shortly!</p>
<p>Thank you for your patience.</p>
<p>Team</p>
</div>
</article>
</body>
</html>

The above HTML will look like the image below.

Save the above HTML as maintanence.html

Create a file called Dockerfile with the below content

# pull the latest official nginx image
FROM nginx:stable
# run docker service on HTTPS
EXPOSE 443
# copy the additional nginx configuration
COPY maintanence.conf /etc/nginx/conf.d/maintanence.conf
# copy ssl pem
COPY domain.org.pem /etc/nginx/conf.d/domain.org.pem
# copy ssl key
COPY domain.org.key /etc/nginx/conf.d/domain.org.key
# copy static maintanence
COPY maintanence.html /usr/share/nginx/html/index.html
STOPSIGNAL SIGQUITCMD ["nginx", "-g", "daemon off;"]

Create a sample Nginx configuration file with the below configuration called maintanence.conf

# redirect http requests to httpsserver {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl;
underscores_in_headers on;
ssl_certificate /etc/nginx/conf.d/domain.org.pem;
ssl_certificate_key /etc/nginx/conf.d/domain.org.key;
ssl_session_cache shared:SSL:10m;
ssl_session_timeout 10m;
ssl_protocols TLSv1.2;
ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;
client_max_body_size 50M;
access_log /var/log/nginx/access.log;
error_log /var/log/nginx/errors.log;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ =404;
}
}

Have the SSL key, SSL pem, maintanence.html, Dockerfile in the same directory.

Build and push the docker image:

# replace the docker_repository and tag_name appropriatelydocker build -t your_docker_container_repository:tag_name .
docker push your_docker_container_repository:tag_name

Create nginx-deployment.yaml with the below content

apiVersion: apps/v1
kind: Deployment
metadata:
name: maintenance-nginx
spec:
selector:
matchLabels:
run: maintenance-nginx
replicas: 1
template:
metadata:
labels:
run: maintenance-nginx
spec:
containers:
- image: your_docker_container_repository:tag_name
name: maintenance-nginx
ports:
- containerPort: 443

Create nginx-service.yaml with the below content

apiVersion: v1
kind: Service
metadata:
name: maintenance-nginx
labels:
run: maintenance-nginx
spec:
ports:
- name: http
port: 80
protocol: TCP
targetPort: 80
- name: https
port: 443
protocol: TCP
targetPort: 443
type: LoadBalancer
selector:
run: maintenance-nginx

Create nginx deployment and service in the Kubernetes cluster

export KUBECONFIG=<your_kube_config_file.yml>kubectl apply -f nginx-deployment.yamlkubectl apply -f nginx-service.yaml# Get the load balancer urlkubectl get services

Visit the load balancer URL to find the static maintenance page and that’s it.
Use it whenever required during scheduled maintenance or upgrade etc.

--

--