AnechaS/Dockerfile

## README.md

      
    Raw
  

              README.md
            
          
    Docker apache httpd server with SSL/HTTPS and HTTP support.

Build Image

$ docker build . -t my-httpd
Create Container

docker run --name my-httpd-server -p 80:80 -p 443:443 -d my-httpd

After starting the server, you can visit https://localhost in your browser

  
## Dockerfile
FROM httpd:2.4

COPY httpd.conf /usr/local/apache2/conf/httpd.conf
COPY index.html /usr/local/apache2/htdocs/index.html

RUN apt-get update \
    && apt-get -y install openssl \
    && cd /usr/local/apache2/conf \
    && openssl req -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout server.key -out server.crt -subj '/CN=localhost'

## httpd.conf
#
# ServerRoot: The top of the directory tree under which the server's
# configuration, error, and log files are kept.
#
# Do not add a slash at the end of the directory path.  If you point
# ServerRoot at a non-local disk, be sure to specify a local disk on the
# Mutex directive, if file-based mutexes are used.  If you wish to share the
# same ServerRoot for multiple httpd daemons, you will need to change at
# least PidFile.
#
ServerRoot "/usr/local/apache2"

#
# Listen: Allows you to bind Apache to specific IP addresses and/or
# ports, instead of the default. See also the <VirtualHost>
# directive.
#
# Change this to Listen on specific IP addresses as shown below to
# prevent Apache from glomming onto all bound IP addresses.
#
Listen 80
Listen 443

#
# Dynamic Shared Object (DSO) Support
#
# To be able to use the functionality of a module which was built as a DSO you
# have to place corresponding `LoadModule' lines at this location so the
# directives contained in it are actually available _before_ they are used.
# Statically compiled modules (those listed by `httpd -l') do not need
# to be loaded here.
#
LoadModule mpm_event_module modules/mod_mpm_event.so
LoadModule authn_file_module modules/mod_authn_file.so
LoadModule authn_core_module modules/mod_authn_core.so
LoadModule authz_host_module modules/mod_authz_host.so
LoadModule authz_groupfile_module modules/mod_authz_groupfile.so
LoadModule authz_user_module modules/mod_authz_user.so
LoadModule authz_core_module modules/mod_authz_core.so
LoadModule access_compat_module modules/mod_access_compat.so
LoadModule auth_basic_module modules/mod_auth_basic.so
LoadModule reqtimeout_module modules/mod_reqtimeout.so
LoadModule filter_module modules/mod_filter.so
LoadModule mime_module modules/mod_mime.so
LoadModule log_config_module modules/mod_log_config.so
LoadModule env_module modules/mod_env.so
LoadModule headers_module modules/mod_headers.so
LoadModule setenvif_module modules/mod_setenvif.so
LoadModule version_module modules/mod_version.so
LoadModule ssl_module modules/mod_ssl.so
LoadModule unixd_module modules/mod_unixd.so
LoadModule status_module modules/mod_status.so
LoadModule autoindex_module modules/mod_autoindex.so
LoadModule dir_module modules/mod_dir.so
LoadModule alias_module modules/mod_alias.so
LoadModule rewrite_module modules/mod_rewrite.so

ServerName localhost

<IfModule mod_rewrite.c>
    RewriteEngine On
</IfModule>

<VirtualHost *:80>
    RewriteEngine On
    RewriteCond %{HTTPS} off
    RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</VirtualHost>

<VirtualHost *:443>
    SSLEngine On
    SSLCertificateFile "/usr/local/apache2/conf/server.crt"
    SSLCertificateKeyFile "/usr/local/apache2/conf/server.key"

    # Allow requests to HTTP resources
    # @see: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/upgrade-insecure-requests
    Header always set Content-Security-Policy "upgrade-insecure-requests;"

    DocumentRoot "/usr/local/apache2/htdocs"
    ServerName localhost
    ServerAlias www.localhost

    <Directory "/usr/local/apache2/htdocs">
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

## index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Posts</title>
    <style>
      * {
        margin: 0px;
        padding: 0px;
        box-sizing: border-box;
      }

      .container {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
        padding: 8px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        font-family: "Courier New", Courier, monospace;
      }

      .header {
        padding-top: 8px;
        width: 100%;
      }

      .list {
        display: flex;
        flex-direction: column;
        gap: 8px;
      }

      .item {
        border: 2px solid #000000;
        padding: 8px 16px;
        border-radius: 4px;
        cursor: pointer;
        position: relative;
      }

      .item-title {
        font-size: 18px;
        font-weight: 600;
      }

      .item-body {
        margin-top: 8px;
        font-size: 16px;
      }

      .progress {
        font-size: 16px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
      }
    </style>
  </head>
  <body>
    <main class="container">
      <header class="header">
        <h2>Posts</h2>
        <small>Docker httpd server with SSL/HTTPS and HTTP support.</small>
      </header>

      <div class="progress">
        <span>Loading...</span>
      </div>

      <div class="list"></div>
    </main>
    <script>
      async function getData() {
        const progress = document.querySelector(".progress");

        try {
          const data = await fetch("http://jsonplaceholder.typicode.com/posts?_limit=5").then(
            (response) => response.json()
          );

          if (progress) progress.setAttribute("hidden", "hidden");

          const list = document.querySelector(".list");

          for (const o of data) {
            const item = document.createElement("div");
            item.classList.add("item");

            const itemTitle = document.createElement("div");
            itemTitle.classList.add("item-title");
            itemTitle.appendChild(document.createTextNode(o.title));

            const itemBody = document.createElement("div");
            itemBody.classList.add("item-body");
            itemBody.appendChild(document.createTextNode(o.body));

            item.appendChild(itemTitle);
            item.appendChild(itemBody);

            list.appendChild(item);
          }
        } catch (error) {
          console.error(error);
          progress.querySelector("span").textContent = `Error loading. Check console for details.`;
        }
      }

      document.addEventListener("DOMContentLoaded", getData);
    </script>
  </body>
</html>
	FROM httpd:2.4

	COPY httpd.conf /usr/local/apache2/conf/httpd.conf
	COPY index.html /usr/local/apache2/htdocs/index.html

	RUN apt-get update \
	&& apt-get -y install openssl \
	&& cd /usr/local/apache2/conf \
	&& openssl req -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout server.key -out server.crt -subj '/CN=localhost'
	#
	# ServerRoot: The top of the directory tree under which the server's
	# configuration, error, and log files are kept.
	#
	# Do not add a slash at the end of the directory path. If you point
	# ServerRoot at a non-local disk, be sure to specify a local disk on the
	# Mutex directive, if file-based mutexes are used. If you wish to share the
	# same ServerRoot for multiple httpd daemons, you will need to change at
	# least PidFile.
	#
	ServerRoot "/usr/local/apache2"

	#
	# Listen: Allows you to bind Apache to specific IP addresses and/or
	# ports, instead of the default. See also the <VirtualHost>
	# directive.
	#
	# Change this to Listen on specific IP addresses as shown below to
	# prevent Apache from glomming onto all bound IP addresses.
	#
	Listen 80
	Listen 443

	#
	# Dynamic Shared Object (DSO) Support
	#
	# To be able to use the functionality of a module which was built as a DSO you
	# have to place corresponding `LoadModule' lines at this location so the
	# directives contained in it are actually available _before_ they are used.
	# Statically compiled modules (those listed by `httpd -l') do not need
	# to be loaded here.
	#
	LoadModule mpm_event_module modules/mod_mpm_event.so
	LoadModule authn_file_module modules/mod_authn_file.so
	LoadModule authn_core_module modules/mod_authn_core.so
	LoadModule authz_host_module modules/mod_authz_host.so
	LoadModule authz_groupfile_module modules/mod_authz_groupfile.so
	LoadModule authz_user_module modules/mod_authz_user.so
	LoadModule authz_core_module modules/mod_authz_core.so
	LoadModule access_compat_module modules/mod_access_compat.so
	LoadModule auth_basic_module modules/mod_auth_basic.so
	LoadModule reqtimeout_module modules/mod_reqtimeout.so
	LoadModule filter_module modules/mod_filter.so
	LoadModule mime_module modules/mod_mime.so
	LoadModule log_config_module modules/mod_log_config.so
	LoadModule env_module modules/mod_env.so
	LoadModule headers_module modules/mod_headers.so
	LoadModule setenvif_module modules/mod_setenvif.so
	LoadModule version_module modules/mod_version.so
	LoadModule ssl_module modules/mod_ssl.so
	LoadModule unixd_module modules/mod_unixd.so
	LoadModule status_module modules/mod_status.so
	LoadModule autoindex_module modules/mod_autoindex.so
	LoadModule dir_module modules/mod_dir.so
	LoadModule alias_module modules/mod_alias.so
	LoadModule rewrite_module modules/mod_rewrite.so

	ServerName localhost

	<IfModule mod_rewrite.c>
	RewriteEngine On
	</IfModule>

	<VirtualHost *:80>
	RewriteEngine On
	RewriteCond %{HTTPS} off
	RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
	</VirtualHost>

	<VirtualHost *:443>
	SSLEngine On
	SSLCertificateFile "/usr/local/apache2/conf/server.crt"
	SSLCertificateKeyFile "/usr/local/apache2/conf/server.key"

	# Allow requests to HTTP resources
	# @see: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/upgrade-insecure-requests
	Header always set Content-Security-Policy "upgrade-insecure-requests;"

	DocumentRoot "/usr/local/apache2/htdocs"
	ServerName localhost
	ServerAlias www.localhost

	<Directory "/usr/local/apache2/htdocs">
	AllowOverride All
	Require all granted
	</Directory>
	</VirtualHost>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Posts</title>
	<style>
	* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
	}

	.container {
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-family: "Courier New", Courier, monospace;
	}

	.header {
	padding-top: 8px;
	width: 100%;
	}

	.list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	}

	.item {
	border: 2px solid #000000;
	padding: 8px 16px;
	border-radius: 4px;
	cursor: pointer;
	position: relative;
	}

	.item-title {
	font-size: 18px;
	font-weight: 600;
	}

	.item-body {
	margin-top: 8px;
	font-size: 16px;
	}

	.progress {
	font-size: 16px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	}
	</style>
	</head>
	<body>
	<main class="container">
	<header class="header">
	<h2>Posts</h2>
	<small>Docker httpd server with SSL/HTTPS and HTTP support.</small>
	</header>

	<div class="progress">
	<span>Loading...</span>
	</div>

	<div class="list"></div>
	</main>
	<script>
	async function getData() {
	const progress = document.querySelector(".progress");

	try {
	const data = await fetch("http://jsonplaceholder.typicode.com/posts?_limit=5").then(
	(response) => response.json()
	);

	if (progress) progress.setAttribute("hidden", "hidden");

	const list = document.querySelector(".list");

	for (const o of data) {
	const item = document.createElement("div");
	item.classList.add("item");

	const itemTitle = document.createElement("div");
	itemTitle.classList.add("item-title");
	itemTitle.appendChild(document.createTextNode(o.title));

	const itemBody = document.createElement("div");
	itemBody.classList.add("item-body");
	itemBody.appendChild(document.createTextNode(o.body));

	item.appendChild(itemTitle);
	item.appendChild(itemBody);

	list.appendChild(item);
	}
	} catch (error) {
	console.error(error);
	progress.querySelector("span").textContent = `Error loading. Check console for details.`;
	}
	}

	document.addEventListener("DOMContentLoaded", getData);
	</script>
	</body>
	</html>