Dockerize and Secure WordPress behind a Proxy

When you hear the words WordPress, Secure and Proxy you might start having nightmares. But there is no reason for that. Just by following the instructions hereunder, and setting up the proxy carefully, you should be able to carry out this tiresome task easily.

Why a proxy helps secure a whole application at once?

Well, basically because it is easier to implement and faster to scale when you want to serve multiple applications in the same host.

Let’s start with docker

In the following section you will find several scripts to run Docker containers, each one detailing both, its purpose and its configurations.

So, first you should start setting up the file structure that will be used all over the post:

├─ init-db/

│ └─ wordpress-init-db.sql

├─ proxy-nginx/

│ └─ default.conf

├─ wordpress/

│ └─ 000-default.conf

├─ create_proxy_nginx.sh

├─ create_wordpress_mysql.sh

└─ create_wordpress.sh

Mysql database container

Before running the MySQL container you need to mount a pre-loaded WordPress database named as wordpress that has already defined the SITE_URL and HOME variables with the url for your site, like http://wordpress.example.com. Next you will find the create script for the container:

Wordpress container

Once the MySQL container is created and running properly, you should create the WordPress container, and override the default Apache configuration with a custom defined settings like the ServerName that will be used in the next step. Hereafter you will find the creation script for the container and a summary of the Apache configuration:

Nginx proxy container

Now let’s create the Nginx container that will act as a proxy for your WordPress site. It’s important to link it with the WordPress container and setup the default.conf configuration file for the Nginx container. Next you will find the creation script for the container and a summary of the Nginx configuration. Be aware of the proxy_set_header defined there:

Running everything!

First we need to setup execution grants to all the *.sh files with:

3b9242599849341e7e6ba408c7963ac1

Be sure to run all these scripts in the root folder

1. Run the create_wordpress_mysql.sh script and wait until it is ready and the database is created.

2. Run the create_wordpress.sh script and wait until it is ready.

3. Run the create_proxy_nginx.sh script.

4. Add in your /etc/hosts an alias wordpress.example.com that points to `127.0.1.1`.

Now, you should be able to browse http://wordpress.example.com and see the WordPress site properly

Fixing mixed assets content error easily

Fixing protocol errors

You may face “Mixed Content Error” thrown by WordPress when there are some assets being loaded by http instead of https.

To solve it, you need to install a plugin SSL Insecure Content Fixer.

1. Open a browser

2. Navigate to http://wordpress.example.com/wp-admin

3. Log in with the credentials used before when running the wordpress container

4. Install and activate the SSL Insecure Content Fixer

5. Navigate to Settings -> SSL Insecure Content

6. Set HTTPS detection to HTTP_X_FORWARDED_PROTO (e.g. load balancer, reverse proxy, NginX)

The following extra steps are just in case you are still seeing the error.

1. Navigate to Settings -> General

2. Set the WordPress Address (URL) and Site Address (URL) to your new HTTPS address, in our case https://wordpress.example.com

That’s it! You should now enjoy your secure WordPress application running properly.

Nice, but where is the trick? Well, it’s docker.

Docker has a predefined behavior when you use the --link command to connect your containers. All the containers connected with this command have an alias defined in the /etc/hosts file of the container where you connect the others.

And the other trick is just a couple of headers that you need to define in order to allow the WordPress plugin (SSL Insecure Content Fixer) to be aware that it’s receiving a proxy redirection request.

What’s next?

In our next post you will learn how to test your SSL certificates locally in your Chrome browser to be sure that is it working fine and that your site will be ready when you decide to go live.